title: Detect if the click is in bar or outside of bar in ChartJS
body: <p>I am working with chartJS bar graph. I want to detect the location of click. How can I detect if graph was clicked in bar or outside the bar region in chartJS?</p>
  <pre><code>const waterFChart = new Chart(canvasRef.current, {
      plugins: [ChartDataLabels],
      type: &quot;bar&quot;,
      data: {
          labels: [&quot;Label 1&quot;, &quot;Label 2&quot;, &quot;Label 3&quot;, &quot;Label 4&quot;, &quot;Label 5&quot;],
          datasets: [
              {
                  label: 'Failures',
                  type: &quot;bar&quot;,
                  data: [10, 20, 30, 41, 51],
                  backgroundColor:&quot;green&quot;,
                  hoverBackgroundColor: darkBar,
              }
                    ]
             }
  
            options:{
               onClick: function (e) {
                    if(clicked on bar){
                      {alert(&quot;Clicked on bar&quot;)
                     }
                    else {
                      alert(&quot;Clicked outside of the bar&quot;);
                    }
                  },
            );
  </code></pre>