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

Community Tip - You can Bookmark boards, posts or articles that you'd like to access again easily! X

Integration of highchart.js, d3.js or chart.js into ThingWorx

kahmeng96
12-Amethyst

Integration of highchart.js, d3.js or chart.js into ThingWorx

Hi all, I am trying to modify the XY chart widget but I cannot modify the TW.ChartLibrary package as I do not have access to it. I have created a new XY chart extension based on the existing one (see attached zip file) and I want to know whether it is possible for me to integrate the APIs of highchart.js, d3.js or chart.js into my JavaScript code so that I can modify the extension correctly without touching the TW.ChartLibrary package. If integration is possible, how can I do so? 

1 ACCEPTED SOLUTION

Accepted Solutions
kahmeng96
12-Amethyst
(To:slangley)

Hi @slangley,

My requirements are as follows: I want to create a custom XY chart widget (similar to the existing XY chart widget) in ThingWorx and I want the x-axis to be on the top of the chart so that the intersection of the x-axis with the y-axis is in the top left corner instead of the bottom left corner. The x-axis values should increase from left to right and the y-axis values should increase from top to bottom.

 

However, I have already used the d3.js library to help me draw the chart as I did not want to modify the TW.ChartLibrary. Nonetheless, it will be great if you could suggest any other ways to meet my requirements.

 

View solution in original post

5 REPLIES 5
slangley
23-Emerald II
(To:kahmeng96)

Hi @kahmeng96.

 

Can you provide some specifics around what you are developing?  We have some new beta widgets that may provide the functionality you're needing.  We began introducing those in ThingWorx 8.4.

 

Regards.

 

--Sharon

kahmeng96
12-Amethyst
(To:slangley)

Hi @slangley,

What I am currently trying to develop is described in the link below. Appreciate if anyone could help!

https://community.ptc.com/t5/ThingWorx-Developers/Changing-x-axis-and-y-axis-of-XY-chart-widget/m-p/625193#M38844

slangley
23-Emerald II
(To:kahmeng96)

Hi @kahmeng96.

 

We're not clear on your requirement.  What is missing from the solution you already found?

 

Regards.

 

--Sharon

kahmeng96
12-Amethyst
(To:slangley)

Hi @slangley,

My requirements are as follows: I want to create a custom XY chart widget (similar to the existing XY chart widget) in ThingWorx and I want the x-axis to be on the top of the chart so that the intersection of the x-axis with the y-axis is in the top left corner instead of the bottom left corner. The x-axis values should increase from left to right and the y-axis values should increase from top to bottom.

 

However, I have already used the d3.js library to help me draw the chart as I did not want to modify the TW.ChartLibrary. Nonetheless, it will be great if you could suggest any other ways to meet my requirements.

 
slangley
23-Emerald II
(To:slangley)

Hi @kahmeng96.

 

Without knowing what conflicts you might run into, we suggest that you reach out to the Sales team for requesting an engagement with our Services team.  They are more equipped to assist you with the solution.

 

Regards.

 

--Sharon

Top Tags