Skip to Content (Press Enter)
UserImage.jpg
Junaid Jalal
101Views
6Comments
Solved
Xrange HighCharts implementation
Question

Hello,

I'm looking for a use case for the HighCharts XRange series implementation in outsystems if someone has tried it. 


My data includes 3-4 production lines which have different schedules for running per day, which I want represented on the XRange series. 


Here's the view:

0
0
19 Feb 2020
Copy Link
2020-09-15 13-07-23
Kilian Hekhuis
 
MVP
Solution

Yeah, sorry Preperation. Attached my test OML.

See solution in context
KhTestChartXRange.oml
0
0
19 Feb 2020
Copy Link
UserImage.jpg
Junaid Jalal

Kilian Hekhuis wrote:

Yeah, sorry Preperation. Attached my test OML.

Thanks!


0
0
19 Feb 2020
Copy Link
2020-09-15 13-07-23
Kilian Hekhuis
 
MVP

Well, a preliminary test shows it's possible, but I had to do some things. My test uses a copy/paste of the JSON of this example on the Highcharts site:

What I did:

  1. I used the BarChart as a basis, with an empty SourceDataPointsList;
  2. I added an AdvancedFormatInit to the Chart's AdvancedFormat property, setting the HighchartsJSON to the JSON of the example;
  3. I added an AddJavaScriptTag (from the HTTPRequestHandler Extension) with a JavaScriptURL of "https://code.highcharts.com/6.1.4/modules/xrange.js", and Defer set to True (so it loads after the Platform Highcharts).

As you can see, it's not perfect yet, it needs some XAxisJSON to display the proper dates, the mouse-over isn't right, etc., but as a proof of concept I think it's a success :).

1
0
19 Feb 2020
Copy Link
UserImage.jpg
Junaid Jalal

Kilian Hekhuis wrote:

Well, a preliminary test shows it's possible, but I had to do some things. My test uses a copy/paste of the JSON of this example on the Highcharts site:

What I did:

  1. I used the BarChart as a basis, with an empty SourceDataPointsList;
  2. I added an AdvancedFormatInit to the Chart's AdvancedFormat property, setting the HighchartsJSON to the JSON of the example;
  3. I added an AddJavaScriptTag (from the HTTPRequestHandler Extension) with a JavaScriptURL of "https://code.highcharts.com/6.1.4/modules/xrange.js", and Defer set to True (so it loads after the Platform Highcharts).

As you can see, it's not perfect yet, it needs some XAxisJSON to display the proper dates, the mouse-over isn't right, etc., but as a proof of concept I think it's a success :).

I did the same, but don't see the chart rendering. At what point did you do the point #3? As part of the preparation? 


0
0
19 Feb 2020
Copy Link
UserImage.jpg
Junaid Jalal

Thank you! Let me give it a try and mark it as resolved.

1
0
19 Feb 2020
Copy Link
2020-09-15 13-07-23
Kilian Hekhuis
 
MVP
Solution

Yeah, sorry Preperation. Attached my test OML.

KhTestChartXRange.oml
0
0
19 Feb 2020
Copy Link
UserImage.jpg
Junaid Jalal

Kilian Hekhuis wrote:

Yeah, sorry Preperation. Attached my test OML.

Thanks!


0
0
19 Feb 2020
Copy Link
2020-09-15 13-07-23
Kilian Hekhuis
 
MVP

You're most welcome :). Happy coding!

1
0
19 Feb 2020
Copy Link
Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.