search
LoginSignup
2
Help us understand the problem. What are the problem?

More than 3 years have passed since last update.

はじめに

PTCが提供しているVuforia StudioのJavascriptでThingworxからパラメターやサービスを利用することで、ARのコンテンツからリアルタイムでThingworxとデータ連携する機能について紹介する。

前提と準備

環境と準備については、Thingworx FoundationインストールVuforia StudioインストールExperience Serviceを参考してください。

Studioのアーキテクチャとプロセスフロー

エクスペリエンスサービスをプロビジョニングするのを待っている間、Thingworx Foundationのサービスからデータを取得してViewに渡す、Javascriptの機能についてもう少し詳しく知ることができる。
StudioFlow.png

ステップ1:Home.jsコード開く

1.VIEWSの下のオプションを展開するVIEWS> [ ホーム ] をクリックします。
2.オプションを展開して、 VIEWS> Home.jsをクリックします。
08_arco_home_js.png

ステップ2:ThingworxのPropertyを取得する

Thing名とProperty名を指定してバリューを取得する。

home.js
$scope.view.wdg[label-1][text] = 
        $scope.app.mdl[Motor01'].properties[‘Motor_Temperature’];

ステップ3:Thingworxのサービスを使用する

vuforia_js_service.PNG

1.twx.app.fn.triggerDataService(Thing名, service名, parameters)を渡してデータを取得する。

home.js
$scope.app.runMyTWXService1 = function() {
    var TWXmodelID = 'myTWXThing'; //Thing Name
    var serviceName = 'QueryNumberPropertyHistory';
    var parameters = {'propertyName': 'Temp', 'maxItems': 10}; //input parameters object 
    twx.app.fn.triggerDataService(TWXmodelID, serviceName, parameters);
};
$scope.app.runMyTWXService2 = function() {
    var TWXmodelID = 'myAssetTemplate'; //Thing Name
    var serviceName = 'QueryImplementingThingsWithData';

    var data = {};
    data.query = {};
    data.query.filters = {};
    data.query.filters.type = "AND"; // OR is also available 
    data.query.filters.filters = [];
    data.query.filters.filters[0] = { type: "GT", fieldName: "Temp", value: 18};
    data.query.filters.filters[1] = { type: "GT", fieldName: "HeliumLevel", value: 27};  

    twx.app.fn.triggerDataService(TWXmodelID, serviceName, data);
};

2.Angular JSサービス($on())を使用して、$scopeのイベントをJavaScriptで"リスニング"することができる。 特にThingWorxサービス完了イベントの場合、serviceInvokeCompleteイベントのコールバックを利用する。

home.js
$scope.$on('myTestService.serviceInvokeComplete', function(evt, arg) {
   // do something with the returned data from ThingWorx…
   $scope.view.wdg['label-1']['text'] = $scope.app.mdl['mything'].svc['myTestService'].data.current;

});

3.$onで利用できるThingWorxサービスのイベント

home.js
$scope.$root.$on('myTestService-begin', function(evt, arg) // service has been called
$scope.$root.$on('myTestService-complete', function(evt, arg) // successful completion
$scope.$root.$on('myTestService-end', function(evt, arg) // ended (success or fail)
$scope.$root.$on('myTestService-failed', function(evt, arg) // service failed
$scope.$on('myTestService.serviceFailure', function(evt, arg) 

ステップ4:Thingworx側にデータをプッシュする

DataShapeのデータ型に合わせてデータを作成してプッシュする。

home.js
$scope.app.pushMyTWXService = function() {
    var serviceName = "myTestITService";
    var data = {};
    data.InfoTableInput = {};  
    data.InfoTableInput.dataShape = {};
    data.InfoTableInput.dataShape.fieldDefinitions = {"FieldA":{"name":"FieldA","baseType":"STRING"},"FieldB":{"name":"FieldB","baseType":"STRING"},"FieldC":{"name":"FieldC","baseType":"NUMBER"}};
    data.InfoTableInput.rows = [];
    data.InfoTableInput.rows[0] = {"FieldA":"inputA1","FieldB":"inputB1","FieldC":101};
    data.InfoTableInput.rows[1] = {"FieldA":"inputA2","FieldB":"inputB2","FieldC":201};

    twx.app.fn.triggerDataService(TWXmodelID, serviceName, data);
};

終わりに

JavascriptでThingworxとのデータ連携について、以下の方法を学びました。

  • ThingworxのPropertyを取得する
  • Thingworxのサービスを使用する
  • Thingworxのサービスのイベントを使用する
  • Thingworx側にデータをプッシュする

VuforiaStudioの使い方については下記のその他リソースをご参考下さい。

その他リソース

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
2
Help us understand the problem. What are the problem?