38
Views
7
Comments
Solved
Wind Rose in OutSystems
Application Type
Traditional Web

I have the following data:

For x days with 15 minutes interval.


I need to create a wind rose with this speed (m/s) and direction (º) like this:

I would need only N,NE,E,SE,S,SW,W,NW.


How could I do it in OutSystems?


I found this HighChart, but I don't know how to implement it in OutSystems.


https://www.highcharts.com/demo/android/polar-wind-rose/grid-light

2023-08-28 07-00-10
Paulo Torres
Champion
Solution

Yes, in traditional is different.

You should add JS in resources and after you can call with action AddJavaScriptTag.

You can download my component: MarkdownParser and see how I did this.

2022-08-03 04-32-50
Ravi Punjwani

Hi Jose,

It won't be possible with default Outsystems' charting component.

Here's the original demo, https://www.highcharts.com/demo/polar-wind-rose/sand-signika

If you look into its javascript (EDIT IN JSFIDDLE link), you can notice two major changes in how the chart has been configured. One change is that the chart > polar: true. This is the only change in configuration / code in javascript. But another major change is that the example includes an additional library which is highcharts-more.js

"https://code.highcharts.com/highcharts-more.js"

Since this javascript is not included by default in the Outsystems, you can't just plug in this javascript in your code and get it working.

But here's a workaround found in a similar post, which also gives a sample code
https://www.outsystems.com/forums/discussion/76507/waterfall-chart-and-highcharts/

Let me know if this helps or not.

UserImage.jpg
José Soares

Hi Ravi, is it possible to have Highcharts-more.js in tradition web? I can't find a package with scripts section... I'm new to outsystems so I'm not so fast searching those topics...

2023-08-28 07-00-10
Paulo Torres
Champion

Yes, JS is the same for react or Traditional

UserImage.jpg
José Soares

Hi Paulo,

My main problem now is how can I integrate that JS in my traditional...

I think I should have something like this:

Instead, I have this: 

2023-08-28 07-00-10
Paulo Torres
Champion
Solution

Yes, in traditional is different.

You should add JS in resources and after you can call with action AddJavaScriptTag.

You can download my component: MarkdownParser and see how I did this.

2023-08-28 07-00-10
Paulo Torres
Champion

You can see my components, I have Gantt and Stock from Highcharts integrated with OS.

https://www.outsystems.com/forge/component-overview/13767/gantt-highcharts

https://www.outsystems.com/forge/component-overview/14109/stock-highcharts

Let me know if you need help.

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.