Hi Guys

Fairly new to highcharts and using json in outsystems. Was wondering if someone could help me get my Gantt chart working - as demonstrated here: https://www.highcharts.com/docs/chart-and-series-types/x-range-series

I have a number of statuses, which I would like to use as my Y-axis, and a start and end date for each status which I'm using as my two X-axis values.

I have used the Javascript code as follows:

 chart: {
        type: 'xrange'
    title: {
        text: 'Gantt Chart'
    xAxis: {
        type: ''
    yAxis: {
        title: {
            text: ''
        categories: [],
        reversed: true
    series: [{
        name: 'Project 1',
        // pointPadding: 0,
        // groupPadding: 0,
        borderColor: 'gray',
        pointWidth: 20,
        data: "+Json+",
        dataLabels: {
            enabled: true


- I have set the graph up with column format in Outsystems, and have set my source datapoint as a blank local variable, with list datapoint data type.

- in my preparation used SQL to pull out my data, and have used the "ToObject(JSONDataPoint_List)" action to turn my sql list into an object, which i have then asigned to my local variable "JSON"

- I have used a cast in my SQL to cast my sql to get the Date.UTC format. 

- The JSON output is coming out as follows:

[{"x":"Date.UTC(2018, 1, 26)","x2":"Date.UTC(2018, 1, 26)","y":10},{"x":"Date.UTC(2018, 1, 26)","x2":"Date.UTC(2018, 1, 26)","y":8},{"x":"Date.UTC(2018, 1, 26)","x2":"Date.UTC(2099, 12, 31)","y":8}]

Can anyone help me/ tell me where it's going wrong??

Thanks a lot!


what is the problem exactly, because I kinda miss what is going wrong?

J. wrote:


what is the problem exactly, because I kinda miss what is going wrong?

Haha sorry.

So the Y values are appearing on the Y axis, but the X axis is appearing so no bars are showing.