This example demonstrates how to create a simple Candlestick Chart using CanvasJS Chart plugin for jQuery. You can further customize these charts to enable features like Zooming, Panning, Exporting, etc. To know more about the available features please refer to our getting started section.
Once the chart has been rendered, you can get a reference to it by calling CanvasJSChart method on the DOM element without passing any parameter as shown below. Once you have the reference you can update the chart by changing its options.
var chart = $(".chartContainer").CanvasJSChart();
chart.options.title.text += ": Updated";
chart.render();
Please look into the reference section for all the supported options.
4 Comments
Right now, if the axisX interval property is set to 2 and the intervalType is set to Day, it attempts to graph all the days within the range of dates. What if you’re graphic stocks and you only want to graphing on trading days? is this possible? Right now there are empty spaces for every non-trading day, regardless of the values passed in to the data.dataPoints property.
Matt,
You can do so by using labels instead of x values.
Tip: You can use formatDate method to format dateTime values as required.
is there a possibility to get the data from a csv file format and render a candletick chart and if there is such a possibility would you mind showing how to do it.
Hi Arsene,
Yes it is possible.
Checkout this link.