Skip to main content
1-Visitor
July 27, 2022
Solved

Facing issue with Custom UI widget on first load

  • July 27, 2022
  • 2 replies
  • 4414 views

Hi,

 

I have created a Custom UI extension using an External Library -Plotly. JS.
When I first load the mashup using View Mashup from mashup, the widget doesn't load properly, and when I click reload( not Tab reload, its the Reload button which shows up when we click on view mashup), it works perfectly.  And if I reload the tab completely, again for the first time it doesn't work properly 

Another Scenario- I have added a contained Mashup and One of the mashups which loads in contained Mashup has the new widget. The first time I load the contained mashup with the UI widget, it does load properly. If I change the contained mashup and then change it back to the contained mashup( I have 2 buttons to load different mashups with different graphs in contained mashups) with the UI widget, it works perfectly.

Can someone help me how resolve this issue? Thanks in advance.

I am using Thingworx 9.1.6 version 

Best answer by SaiKrishnaPola

Hi Team, After multiple follow-ups with PTC tech support, I did not find a solution for the issue. 
But when I imported the Extension in 9.3 version, It is working fine. There seems to be an issue with 9.1.6 version

2 replies

17-Peridot
July 27, 2022

@SaiKrishnaPola ,

 

Did you create this mashup using Polymer or just plain javascript/html?

 

Thanks,

Nick

1-Visitor
July 27, 2022

@nmilleson  I used plain JavaScript/html to create the extension

17-Peridot
July 28, 2022

@SaiKrishnaPola ,

 

I would put some console logging in each of your event listeners (afterRender, and updateProperty I think they're called).  Specifically, try logging the window size (window.innerWidth and window.innerHeight).  I've run into an issue where on the first time it runs the afterRender function, the window size is still showing 0px for some reason.  This was causing my widget to not render.  If that's not the issue, I would use logging to make sure that your data arrives to your widget before you try and render the Plotly content.  If not, I would put most of your render logic in the "updateProperty " function instead. So something like this:

 

this.updateProperty = function (updatePropertyInfo) {
 if (updatePropertyInfo.TargetProperty === "Data") {
 // chart rendering code
 }
}

 

Hope that helps,

Nick

SaiKrishnaPola1-VisitorAuthorAnswer
1-Visitor
December 6, 2022

Hi Team, After multiple follow-ups with PTC tech support, I did not find a solution for the issue. 
But when I imported the Extension in 9.3 version, It is working fine. There seems to be an issue with 9.1.6 version