Skip to content Skip to sidebar Skip to footer

Move Images Rendered On Highcharts On Resize

I'm adding an image to the lower right hand corner of a chart in the chart loading event using the chartWidth and chartHeight properties to calculate the left / top offsets. chart.

Solution 1:

Why not on resize remove the image, then once the chart is done being resized, recalculate the position and add the image back?

Solution 2:

I ended up storing a reference to the original width of the chart and the image. Then on resize, I'm shifting the image by the offset of the two widths -

var img, originalWidth;

functionchartLoad(chart) {
  var top = 100, left = 100;

  originalWidth = chart.chartWidth;
  img = chart.renderer.image('img.png', left, top, 30, 30).add();
}

functionchartResize(e) {
  var offset = e.target.chartWidth - originalWidth;
  img.translate(offset, 0);
}

Post a Comment for "Move Images Rendered On Highcharts On Resize"