Skip to main content
1-Visitor
May 16, 2017
Solved

How to use the thingworx styles in an extension widget?

  • May 16, 2017
  • 2 replies
  • 2373 views

Hi all,

I am currently developing a responsive doughnut chart widget and I have finally managed to finish everything except the styles. I want to be able to set the colour of the chart from the Thingworx Composer, however I am no table to get the information available in the style I created on my runtime Javascript.

So my question is how are you able to use the style information in the development of an extension widget? How can I get the Background Color, Foreground Color, Line color, Line Thickness, etc... from the style to my runtime?

I have tried using this.getProperty('ChartStyle'), this.properties['ChartStyle'] both which return a simple String. I have also tried

if (updatePropertyInfo.TargetProperty === "ChartStyle"){

  var styleData = updatePropertyInfo.ActualDataRows;

}

And then use the Chrome developer tools to see if I could get a value an array out of it and I ended up with undefined. Any help would be appreciated, thank you!

Eric

Best answer by VladimirRosu_116627

Hi Eric,

The styles require a different way of accessing the property, and it's through a helper function.

The following information is extracted from the ThingWorx Foundation Extension Development Guide (https://support.ptc.com/view?im_dbkey=170215😞

"Formatting - if you have a property with baseType of STYLEDEFINITION, you can get the style information by calling var formatResult = TW.getStyleFromStyleDefinition( widgetProperties['PropertyName']);"

Best regards,

Vladimir

2 replies

19-Tanzanite
May 16, 2017

Hi Eric,

The styles require a different way of accessing the property, and it's through a helper function.

The following information is extracted from the ThingWorx Foundation Extension Development Guide (https://support.ptc.com/view?im_dbkey=170215😞

"Formatting - if you have a property with baseType of STYLEDEFINITION, you can get the style information by calling var formatResult = TW.getStyleFromStyleDefinition( widgetProperties['PropertyName']);"

Best regards,

Vladimir

1-Visitor
May 16, 2017

Thank you Vladimir! I feel so stupid for not finding it in the extension guide!


Regards,

Eric