cancel
Showing results for 
Search instead for 
Did you mean: 
cancel
Showing results for 
Search instead for 
Did you mean: 

Community Tip - Did you know you can set a signature that will be added to all your posts? Set it here! X

Changing Color via ALERT Trigger

vieirac1
9-Granite

Changing Color via ALERT Trigger

Team,

 

Customer has the following scenario:

1. They created a function to change the color of a particular object - created a function within the .JS

2. They want to execute this function everytime a particular Thing Property is within an alert range

3. They have created an ALERT in the Thing Property, but how to connect the ALERT to call the FUNCTION?

 

Please, any better way of doing this?

 

Tks,

Chris

1 ACCEPTED SOLUTION

Accepted Solutions

In Studio we can also used a Thingworx State definition.

2020-03-24_22-47-07.jpg

Depending on the value of particular Thingworx Thing property  the state will change the apearance of a value

Here in the example the value of Value Display widget is the dependent Field. Means this what is used to decide which state from the thingworx stated defintion is used for the display of the widget

2020-03-24_22-57-57.jpg

 

Here is a sample definition for a Style definition :

 

2020-03-24_23-01-39.jpg

Regarding to the question how to check a value in a code to execute a function depending on a value change - in this case you can use the Angular js watch construct - something like this:

////////////
$scope.$watch( // watch for the color setting
  function()  {
    return $scope.app.params['testNUMber'];
  }
  ,
  function()
  { console.warn("$watch with nubmer= "+ $scope.app.params['testNUMber'])
   $scope.setWidgetProp('gauge-1',  'hiddenValue',  $scope.app.params['testNUMber'])
   $scope.setWidgetProp('gauge-1',  'stateFormatValue','hiddenValue')
  }
  //end of the second function
);

This code will call the function when the parameter testNUMber will change its value

In this case it will set the value  to hiddenValue /customized value/ this will determing the correct state for the guage display

View solution in original post

3 REPLIES 3

Hi @vieirac1 ,

one possible option is to use some state base filter - where you bind the value to e.g. application parameter and then used the techniques described in the post :"Using Connection Filters for state-based rendering and value formatting"

In Studio we can also used a Thingworx State definition.

2020-03-24_22-47-07.jpg

Depending on the value of particular Thingworx Thing property  the state will change the apearance of a value

Here in the example the value of Value Display widget is the dependent Field. Means this what is used to decide which state from the thingworx stated defintion is used for the display of the widget

2020-03-24_22-57-57.jpg

 

Here is a sample definition for a Style definition :

 

2020-03-24_23-01-39.jpg

Regarding to the question how to check a value in a code to execute a function depending on a value change - in this case you can use the Angular js watch construct - something like this:

////////////
$scope.$watch( // watch for the color setting
  function()  {
    return $scope.app.params['testNUMber'];
  }
  ,
  function()
  { console.warn("$watch with nubmer= "+ $scope.app.params['testNUMber'])
   $scope.setWidgetProp('gauge-1',  'hiddenValue',  $scope.app.params['testNUMber'])
   $scope.setWidgetProp('gauge-1',  'stateFormatValue','hiddenValue')
  }
  //end of the second function
);

This code will call the function when the parameter testNUMber will change its value

In this case it will set the value  to hiddenValue /customized value/ this will determing the correct state for the guage display

Tks so much, it helped me a lot

Top Tags