Highcharts Demo

author(s): Torstein Hønsi

by Alagar Kamuthurai

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container"></div>

JavaScript

let selectedPoints = [];
Highcharts.chart('container', {

	plotOptions: {
  	series: {
         marker: {
            enabled: false,
            radius: 0.1,
            states: {
               hover: {
                  enabled: true,
                  radius: 4,
               },
               select: {
                  enabled: true,
                  radius: 5,
               },
            },
         },
    },
    },

  series: [{
    data: [4, 3, 5, 6, 2, 3],
    point: {
    	events: {
            click: function (event) {
               /* console.log('POINT CLICKED', this) */;
               // console.log('CLICK EVENT', event);
               /* console.log('SELECTED POINTS', selectedPoints) */;

               this.update({
                           selected: true
                        
               });

                this.options.selected = true;

                selectedPoints.forEach((p, i) => {
                  console.log('point', p);
                  if (this.series.index === p.series.index) {
                      this.series.chart.series[p.series.index].points[p.index].select(
                        true,
                       true,
                     );
                     this.series.chart.series[p.series.index].points[
                       p.index
                     ].selected = true;
                     console.log('point index', p.index);
                     // this.series.points[p.index].options.selected = true;
                     this.series.points[p.index].select(true, true);
                     console.log(
                        'series',
                        p.series.index,
                        'point',
                        this.series.points[p.index].options.selected,
                     );
                  }
               }); 

               // set clicked point to selected
                this.select(true, true);

               // check if selected point not within same series then...