StockChart with Label breaks range and nav features

[ekaqu1028]

I am trying to use the stock chart to graph minute granularity data, but the issue i was facing was that this data only reflects trading hours so there is a large gap between each day and the auto formatting adds this gap into the chart. To avoid this gap i switched from x to label and the graph is fine, but now nav and range (and zoom) are all broken. If I do not use x and use label instead, what do i need to do to get all the utilities to keep working?

Thanks for your help

[Manoj Mohan]

@ekaqu1028,

You can use x-value instead of label & use scaleBreak to remove gap of non-trading hours. Please take a look at this JSFiddle for an example on removing weekend gap.

—-
Manoj Mohan
Team CanvasJS

[ekaqu1028]

Thanks, i am trying this out but unable to get it to work, keep getting “canvasjs.stock.min.js:152 CanvasJS Error: Breaks 1189 and 1190 are overlapping.” console logs and the UI is unchanged. I am trying to change the start/end dates to see if i can fix this.

[ekaqu1028]

I tried doing the following, but now the day is shrunk to a single line…

scaleBreaks.push({
startValue: new Date(dataPoints[i – 1].x.getTime() + 1),
endValue: new Date(dataPoints[i].x.getTime() – 1),
});

scaleBreaks: {
spacing: 0,
lineThickness: 0,
customBreaks: scaleBreaks
}

I tried to avoid the double render, but the jsfiddle has two renders… was this imporant?

[ekaqu1028]

Thanks, I got this working! The issue was the conditional in your example is designed for weekends, so had to change it to match minutes (if days do not match, take the last as millis + 1 and the latest as millis – 1); with that the lines now line up!

[Manoj Mohan]

@ekaqu1028,

Glad that you were able to solve your use-case.

—-
Manoj Mohan
Team CanvasJS