Attaching Click Event to toolTipContent - CanvasJS JavaScript Charts

Attaching Click Event to toolTipContent - CanvasJS JavaScript Charts

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>

CSS

.canvasjs-chart-tooltip {
  pointer-events: auto !important;
}

JavaScript

window.onload = function() {
  var chart = new CanvasJS.Chart("chartContainer", {  
    title:{
      text: "Attaching Click Event to toolTipContent",
    } ,
    data: [
      {
        type: "pie",
        toolTipContent: "<div id='toolTipContent' onclick='clickHandler()'>{label}: {y}</div>",                
        dataPoints: [
          { label:"apple", y: 71 },
          { label:"mango", y: 55 },
          { label:"cherry", y: 50 },
          { label:"starfruit", y: 65 }
        ]
      }					
    ]
  });
  chart.render();
}

function clickHandler() {
  alert("toolTip Clicked!");
}