Home forums Using CanvasJS image overlay with React Reply To: image overlay with React

#28555

I have found the solution! Using a candlestick chart can get x and y coordinates and apply to the image style in the componentDidMount method.

var imageXCoord = chart.axisX[0].convertValueToPixel(chart.data[0].dataPoints[6].x) – 15; // compensate for image width
var imageYCoord = chart.axisY[0].convertValueToPixel(chart.data[0].dataPoints[6].y[1]);

var imageCircle = document.getElementById(“imagecircle”);
imageCircle.style.position = “absolute”;
imageCircle.style.width = “30px”;
imageCircle.style.left = imageXCoord + “px”;
imageCircle.style.top = imageYCoord + “px”;
imageCircle.style.zIndex = 1;
imageCircle.style.opacity = .5;

  • This reply was modified 2 months, 3 weeks ago by jwvectorvest.