Skip to main content
14-Alexandrite
July 11, 2019
Solved

How to capture a screenshot?

  • July 11, 2019
  • 2 replies
  • 2625 views

Hello friends!


Does exist some way in JS which enable me to capture and screenshot of full or part of a screen?

Then I will send created screenshot into the TWX.

 

My Idea is about creating application which will enable me to capture key steps in assembly as a proof of correct procedure.

 

Thank you for every idea.

 

Thomas

Best answer by RolandRaytchev

Hi @TomasCharvat ,

 

I think this problem/question consist of 2 parts

1.) sending of the data to thingworx-> this is possible via the thingworx services of a repository thing -> SaveImage or SaveBinary 

2.) to generate a snapshot - there is no Vuforia general API method. So means the generation of the snapshot image could be delegated by some  third-party API for the specific platforms (HoloLens, IOS, Android, Windows)

So far I know for Android there is a workaround- but currently it does not work 100% and not supported for the customers use therefore I want only to mention it here as additional information. Also, there is an issue which should be fixed soon from the dev team

The code I tested was something:

$scope.checkCamera_rest = function() { 
//https://<Thingworx-Server>:8443/Thingworx/Things/<TWX-Repository-Thing>/ServiceDefinitions/SaveImage
 
 if(!window.twx.app.isPreview())
 tml3dRenderer.getCameraImage(function(jpeg) {
 $scope.AndroidSaveImageRestApi(jpeg,"test_bild_android.jpg")
}) ;
 else console.log("not applicable for preview mode");
};

/////////// $scope.PreviewSaveImageRestApi(IMG_3482.JPG)
/// here it simple will display the snapshoot to an image widget 
//// and then will saved to repository via Rest API call
 $scope.AndroidSaveImageRestApi = function(img_buffer,img_name)
 {
 let img_data ={}; 
 
//https://medium.com/@koteswar.meesala/convert-array-buffer-to-base64-string-to-display-images-in-angular-7-4c443db242cd
 img_data = arrayBufferToBase64(img_buffer);
 var TYPED_ARRAY = new Uint8Array(img_buffer)
 
 {try{eval(img_data);} catch (dummy_e) {console.log("dummy exception eval="+ dummy_e);}
 var ret_str='data&colon;image/jpeg;base64,'+img_data;
 
 $scope.view.wdg['image-2']['imgsrc']=ret_str; 
 
 }
 
 let path_param ="/Image/"+img_name
 let content_param = img_data 
 let serviceStr = 'SaveImage'
 var req = {}
 
 req = {
 "method":'POST',
 "url":'/Thingworx/Things/CAD-Files-Repository/Services/'+serviceStr+'?Appkey="xxxxxxx-xxxxx-xxxxx-xxxx-xxxxxxxxxxxxxx" HTTP/1.1',
 "Host": 'myserverabcd.studio-trial.thingworx.io:8443',
 "Content-Type": 'application/json',
 "AppKey": 'xxxxxxx-xxxxx-xxxxx-xxxx-xxxxxxxxxxxxxx',
 "Cache-Control": 'no-cache',
 "headers": {
 "Content-Type": 'application/json',
 "Accept": "application/json",
 "Appkey": 'xxxxxxx-xxxxx-xxxxx-xxxx-xxxxxxxxxxxxxx', //this the appkey to your thingworx
 "cache-control": 'no-cache'
 },
 "processData": false

};
 

Here I want to point that this is no recommendation for usage and the  code was only some thing what I tested and found an issue with the quality of the created picture. But in generally this code could work on android 

2 replies

5-Regular Member
July 17, 2019

@TomasCharvat  Seems similar to the discussion under existing thread.  I believe there is no OOTB feature to do this within the Studio application. 

 https://community.ptc.com/t5/Studio/Create-a-screendump-Access-the-camera-in-Vuforia-Studio/m-p/583123

21-Topaz I
July 17, 2019

Hi @TomasCharvat ,

 

I think this problem/question consist of 2 parts

1.) sending of the data to thingworx-> this is possible via the thingworx services of a repository thing -> SaveImage or SaveBinary 

2.) to generate a snapshot - there is no Vuforia general API method. So means the generation of the snapshot image could be delegated by some  third-party API for the specific platforms (HoloLens, IOS, Android, Windows)

So far I know for Android there is a workaround- but currently it does not work 100% and not supported for the customers use therefore I want only to mention it here as additional information. Also, there is an issue which should be fixed soon from the dev team

The code I tested was something:

$scope.checkCamera_rest = function() { 
//https://<Thingworx-Server>:8443/Thingworx/Things/<TWX-Repository-Thing>/ServiceDefinitions/SaveImage
 
 if(!window.twx.app.isPreview())
 tml3dRenderer.getCameraImage(function(jpeg) {
 $scope.AndroidSaveImageRestApi(jpeg,"test_bild_android.jpg")
}) ;
 else console.log("not applicable for preview mode");
};

/////////// $scope.PreviewSaveImageRestApi(IMG_3482.JPG)
/// here it simple will display the snapshoot to an image widget 
//// and then will saved to repository via Rest API call
 $scope.AndroidSaveImageRestApi = function(img_buffer,img_name)
 {
 let img_data ={}; 
 
//https://medium.com/@koteswar.meesala/convert-array-buffer-to-base64-string-to-display-images-in-angular-7-4c443db242cd
 img_data = arrayBufferToBase64(img_buffer);
 var TYPED_ARRAY = new Uint8Array(img_buffer)
 
 {try{eval(img_data);} catch (dummy_e) {console.log("dummy exception eval="+ dummy_e);}
 var ret_str='data&colon;image/jpeg;base64,'+img_data;
 
 $scope.view.wdg['image-2']['imgsrc']=ret_str; 
 
 }
 
 let path_param ="/Image/"+img_name
 let content_param = img_data 
 let serviceStr = 'SaveImage'
 var req = {}
 
 req = {
 "method":'POST',
 "url":'/Thingworx/Things/CAD-Files-Repository/Services/'+serviceStr+'?Appkey="xxxxxxx-xxxxx-xxxxx-xxxx-xxxxxxxxxxxxxx" HTTP/1.1',
 "Host": 'myserverabcd.studio-trial.thingworx.io:8443',
 "Content-Type": 'application/json',
 "AppKey": 'xxxxxxx-xxxxx-xxxxx-xxxx-xxxxxxxxxxxxxx',
 "Cache-Control": 'no-cache',
 "headers": {
 "Content-Type": 'application/json',
 "Accept": "application/json",
 "Appkey": 'xxxxxxx-xxxxx-xxxxx-xxxx-xxxxxxxxxxxxxx', //this the appkey to your thingworx
 "cache-control": 'no-cache'
 },
 "processData": false

};
 

Here I want to point that this is no recommendation for usage and the  code was only some thing what I tested and found an issue with the quality of the created picture. But in generally this code could work on android