@yueming,
You can increase/decrease the number of dataPoints within the axis range as per your requirements and it should work fine. var range = Math.round(e.axisX[0].viewportMaximum - e.axisX[0].viewportMinimum);
var range = Math.round(e.axisX[0].viewportMaximum - e.axisX[0].viewportMinimum);
___ Suyash Singh Team CanvasJS
@ctaceygreen,
Thanks for reporting. We are looking into it and will fix it in the future releases.
@aksangwan,
We are still looking into the issue. We observed that the issue seems to happen only when animation is enabled. You can try disabling animation as of now and that should work fine. ___ Suyash Singh Team CanvasJS
@nisha,
Please take a look at yValueFormatString for formatting y-values in the toolTip. Also, kindly refer axisX.minimum for setting a minimum value and axisX.interval for customizing the interval at which the axis labels are shown.
@gerwinpierce,
You can set the width and height of the chart as per your required printing dimensions in pixels and that should work fine.
Sorry, it is not possible as of now. But we will re-consider this behavior for the future versions. ___ Suyash Singh Team CanvasJS
It is an intended behavior that the crosshair disappears on drag as it might create confusion when zoom/pan is enabled in the chart. But we will reconsider this behavior in the future versions.
— Suyash Singh Team CanvasJS
The issue seems to have occurred since the latest chrome update but works fine across every other browser. We are looking into it and will get back to you at the earliest. ___ Suyash Singh
Rendering multiple dataSeries will 100k dataPoints would take a bit to render. However, filtering dataPoints based on the zoom level will improve the performance. Please take a look at this jsfiddle.
@Wojciech,
Changing chart.axisX[0].stripLines.push(stripLines); to chart.options.axisX[0].stripLines.push(stripLines); should work fine in your case. Also, you can use addTo method to add stripLines dynamically.
chart.axisX[0].stripLines.push(stripLines);
chart.options.axisX[0].stripLines.push(stripLines);
@deni35,
You can have OHLC and Column data-series with different ranges in the same chart by using Multiple Y Axis. Please take a look at the following links: 1. Creating charts with multiple y-axis. 2. axisYIndex, which is the property that lets you choose to which Y axis the dataSeries should be attached.
Aarya,
You can either keep the data-points in the same sequence in all the data-series as in this jsfiddle, or add x values in all the data-points as in this example.
You can loop through each of the column series and create a corresponding series representing the Simple Moving Average as shown in the code snippet below –
// Pass all the data-series to render SMA for(var i = 0; i < numberOfDataSeries; i++) { renderSimpleMovingAverage(chart.options.data[i], 7); } chart.render(); function renderSimpleMovingAverage(dataSeries, smaPeriod) { if(dataSeries.dataPoints.length <= smaPeriod) return; else { // Add a new line series for Moving Averages chart.options.data.push({ type: "spline", markerSize: 0, color: dataSeries.color, name: dataSeries.name + " SMA", yValueFormatString: "#,##0.00", dataPoints: [] }); var total; for(var i = smaPeriod; i < dataSeries.dataPoints.length; i++) { total = 0; for(var j = (i - smaPeriod); j < i; j++) { total += dataSeries.dataPoints[j].y; } chart.options.data[chart.options.data.length - 1].dataPoints.push({ x: dataSeries.dataPoints[i].x, y: total / smaPeriod }); } } }
Please take a look at this JSFiddle.
@stevenbaert,
In JavaScript month starts from 0 instead of 1. So new Date(2018, 2, 1) would be Mar 02 2018(as February 2018 has 28 days). Please take a look at this link on JavaScript Dates for more info.
new Date(2018, 2, 1)