score:1

Accepted answer

you can add this img inside the render events which triggers every time chart was resized.

events: {
  render() {
    var
      chart = this,
      imgwidth = 50;

    //delete old image
    if(chart.customimg){
        chart.customimg.destroy();
    }

    chart.customimg = chart.renderer
      .image('https://www.highcharts.com/samples/graphics/sun.png', chart.chartwidth - imgwidth, 0, imgwidth, imgwidth)
      .add();
  }
},

demo: https://jsfiddle.net/blacklabel/ybdt4mn8/

api: https://api.highcharts.com/highcharts/chart.events.render

also, how can i make the image appear underneath the plot points so the plot point color still shows?

for me, it looks like the custom image has lower zindex than point and appears underneath.

if you have any additional questions - feel free to ask.


Related Query

More Query from same tag