convertValueToPixel in StockChart

[canvy]

Hello, I am using a StockChart, and I need to get the positions of datapoints or better yet, specific x,y values in terms of pixel coordinates on the chart. I know with Chart, you can do that using convertValueToPixel, by calling it on the x or y axis members, but I need to do it on StockChart.

I can’t seem to do that with StockChart, and I can’t seem to find the x or y axis members of a StockChart to be able to do that on.

Note, I am using a StockChart with 2 subcharts within it, one using 3 sets of datapoints, and the other using 1 set of datapoint. The 2 charts are stack on top, with different y-axis, but they share a common DateTime x axis at the bottom.

How can I use convertValueToPixel or equivalent with a StockChart object?

[Indranil]

@canvy,

In case of StockChart, you need to use the convertValueToPixel method with respect to individual charts to get their corresponding pixel coordinates as shown in the code snippet below –

document.getElementById("displayYPixel").innerHTML = "Y-Pixel Coordinates of the dataPoint is: " + Math.round((stockChart.charts[e.chart.index].container.offsetTop + stockChart.charts[e.chart.index].axisY[0].convertValueToPixel(e.dataPoint.y))) + "px";
    
document.getElementById("displayXPixel").innerHTML = "X-Pixel Coordinates of the dataPoint is: " + Math.round((stockChart.charts[e.chart.index].container.offsetLeft + stockChart.charts[e.chart.index].axisX[0].convertValueToPixel(e.dataPoint.x))) + "px";

Please check this JSFiddle for an example on displaying the pixel coordinate of a dataPoint on click.

___________
Indranil Deo
Team CanvasJS