Select and store clicked dataPoints - CanvasJS

Select and store clicked dataPoints - CanvasJS

by canvasjs

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<br/><!-- Just so that JSFiddle's Result label doesn't overlap the Chart -->
<div id="chartContainer" style="height: 360px; width: 100%;"></div>
Results of selected dataPoints will be shown in console

JavaScript

var clickedPoints = [];
var chart = new CanvasJS.Chart("chartContainer",
	{
  		title:{
      	text: "Press Shift Key and select dataPoints"
        },
      zoomEnabled:true,  
      data: [
      {
        type: "spline",
        click:function(e) { 
        	if(!!window.event.shiftKey)
        		clickedPoints.push({x: e.dataPoint.x , y: e.dataPoint.y});
            
            //For showing results in console
            console.clear();
            console.log("Clicked dataPoints");
            for(var i = 0; i<clickedPoints.length; i++)
            	console.log("x: " + clickedPoints[i].x + ", y: " + clickedPoints[i].y);
        },
        dataPoints: [
        { x: 10, y: 71 },
        { x: 20, y: 55},
        { x: 30, y: 50 },
        { x: 40, y: 65 },
        { x: 50, y: 95 },
        { x: 60, y: 68 },
        { x: 70, y: 28 },
        { x: 80, y: 34 },
        { x: 90, y: 14}
        ]
      }
      ]
 });

 chart.render();