Community Tip - Have a PTC product question you need answered fast? Chances are someone has asked it before. Learn about the community search. X
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
Solved! Go to Solution.
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: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
@TomasCharvat Seems similar to the discussion under existing thread. I believe there is no OOTB feature to do this within the Studio application.
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: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