How to Change marker symbol and dataLabel with custom style in Highcharts

Question

How can we customize dataLables and marker symbol on hover? Please refer to the following image:

Answer 1

Add symbols as image (url link) inside markers to the last data in the series

Fork Fiddle explore it

    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)',
    }
    }],
}],

Edit

According to new requirement

        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