Как изменить маркерный символ и dataLabel с пользовательским стилем в Highcharts

Question

Как мы можем настроить данные и символы маркера при наведении? Пожалуйста, обратитесь к следующему изображению:

Answer 1

Добавить символы как изображение (URL ссылки) внутри маркеров последним данным в серии

Fork Fiddle исследовать его

series: [{ 
    data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4,{ 
     y: 26.5, 
     dataLabels: { 
        enabled: true, 
       }, 
     marker: { 
     radius: 10, 
     symbol: 'url(https://www.highcharts.com/samples/graphics/sun.png)', 
    } 
    }], 
}, { 
    data: [216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5,{ 
     y: 103.9, 
     dataLabels: { 
        enabled: true, 
       }, 
     marker: { 
     radius: 10, 
     symbol: 'url(https://www.highcharts.com/samples/graphics/snow.png)', 
    } 
    }], 
}], 

Редактировать

Согласно новому требованию

 series: [{ 
    data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4], 
     point: { 
     events: { 
     mouseOver: function(e) { 
      this.series.data.forEach(p => { 
      p.update({ 
       dataLabels: { 
       enabled: false 
       }, 
       marker: { 
       radius: 10, 
       symbol: 'circle', 
      } 
      }, false, false) 
      }); 

      this.update({ 
      dataLabels: { 
       enabled: true 
      }, 
      marker: { 
      radius: 10, 
      symbol: 'url(https://www.highcharts.com/samples/graphics/sun.png)', 
      } 

      }); 
     } 
     } 
    } 
}, { 
    data: [216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5], 
    point: { 
     events: { 
     mouseOver: function(e) { 
      this.series.data.forEach(p => { 
      p.update({ 
       dataLabels: { 
       enabled: false 
       }, 
       marker: { 
       radius: 10, 
       symbol: 'circle', 
      } 
      }, false, false) 
      }); 

      this.update({ 
      dataLabels: { 
       enabled: true 
      }, 
      marker: { 
      radius: 10, 
      symbol: 'url(https://www.highcharts.com/samples/graphics/snow.png)', 
      } 

      }); 
     } 
     } 
    } 
}], 

Fiddle link

Update Fiddle link