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

Assistance needed attaching Translation to a Slider Widget (with JS)

SOLVED
Highlighted
Visitor

Assistance needed attaching Translation to a Slider Widget (with JS)

Hello,

 

I am working with a model in Thingworx Studio and would like to attach the output of a slider widget to the input of an object item's y-coordinate. That is easy enough to do by dragging the "value" of the slider to the y-coordinate on the object.  But I want to do something more complicated than this.

 

I actually have several model items that I want to move in sync.  Each one of them has a different starting y coordinate.  I want to link all model items to a single slider widget, but I do not want to customize the slider widget's max and min values to any particular object.  I want the entire assembly to move 2.5 units, so I have set up 0 and 2.5 as the boundaries for my slider widget.  If I link the slider's value to the y-coordinate of each model item, using JS to allow multiple relationships, every model item's y is reset to 0 when the widget is first activated.  That's because the starting value (0) is copied to the y-coordinate of each model item.

 

I have tried to create a relationship where the output of the slider is added to a constant, and the resultant value is used by the model item as its y-coordinate.  I think my problem lies in my lack of AngularJS knowledge, but every time I try adding anything to the slider value, the related model item either doesn't move, disappears, or behaves randomly.

 

My code is below.  0.513 is the starting y-coordinate of the related model item.  slide(); is the javascript function in the slider widget's valueChanged text field.  The output of the ycoord parameter is connected to my model item.  The output of the slider widget connects to the slider parameter.

 

$scope.slide = function() {
$scope.app.params.ycoord = $scope.app.params.slider + 0.513;
};

 

Right now I just want to get this working for one model item, and then I can easily expand it to incorporate the other model items I want to move.  I am hoping to solve this problem internally in Thingworx without using Creo to make an animation.

 

Thank you for your help.  Please let me know if more clarification is required.

1 ACCEPTED SOLUTION

Accepted Solutions

Re: Assistance needed attaching Translation to a Slider Widget (with JS)

I think you could do this using filters. Drag the slider value arrow onto each modelItem you want to move with it. Then, for each of those bindings, add a filter that adjusts the value appropriately. For example, your slider varies from 0 to 2.5. If your primary model/modelItem starts at y=0.513, then in the filter for that binding would be something like this:

 

return (value + 0.513)

 

Set up a similar filter for each model/modelItem, each with its own base value, and I think it should do what you want.

View solution in original post

2 REPLIES 2

Re: Assistance needed attaching Translation to a Slider Widget (with JS)

I think you could do this using filters. Drag the slider value arrow onto each modelItem you want to move with it. Then, for each of those bindings, add a filter that adjusts the value appropriately. For example, your slider varies from 0 to 2.5. If your primary model/modelItem starts at y=0.513, then in the filter for that binding would be something like this:

 

return (value + 0.513)

 

Set up a similar filter for each model/modelItem, each with its own base value, and I think it should do what you want.

View solution in original post

Re: Assistance needed attaching Translation to a Slider Widget (with JS)

Thank you very much Clay!  This pretty much solved the problem.  The only change I had to make was wrapping the "value" term in a parseFloat() method so that Thingworx would treat it as a number for the addition to work.  Everything looks good now!

Announcements
Topics available:
AR/VR for Data Optimization AR/VR for Security and Control AR/VR for Inspection