title: Tooltip is not displayed when using annotation in ChartJs
body: <p>When a user try to hover on a dot, it only displays a blue line but it does not show a tooltip as a result below
  <br/>
  <strong>lib version:</strong> <br/>
  &quot;chart.js&quot;: &quot;^2.9.3&quot;,
  &quot;chartjs-plugin-annotation&quot;: &quot;^0.5.7&quot; <br/></p>
  <p>Actual : <a href="https://i.stack.imgur.com/USbEz.png" rel="nofollow noreferrer">enter image description here</a> <br/>
  Expected: <a href="https://i.stack.imgur.com/tjLgQ.png" rel="nofollow noreferrer">enter image description here</a> <br/> <br/> In chart configuration</p>
  <pre><code> export chart = () =&gt; {
           data:{ ... }, 
           options: {
               tooltips: {
                displayColors: false,
                mode: 'index', intersect: true,
                callbacks: {
                  label: function (tooltipItem, data) {
                    return `${data.datasets[tooltipItem.datasetIndex].label}(${Math.round(tooltipItem.xLabel * 100) / 100
                      },${Math.round(tooltipItem.yLabel * 100) / 100})`;
                  },
                },
              },
              legend: {
                display: false,
              },
              annotation: {
                drawTime: &quot;afterDatasetsDraw&quot;,
                events: [&quot;mouseover&quot;],
                annotations: [],
              },
          }
      }
  </code></pre>
  <p>convertToHoverLine();</p>
  <pre><code>export const convertToHoverLine = (value, scaleID) =&gt; {
    return {
      key: &quot;hoverLine&quot;,
      type: &quot;line&quot;,
      mode: &quot;vertical&quot;,
      scaleID,
      value,
      borderColor: &quot;blue&quot;,
      onMouseout: null,
      onMouseover: null,
    }
  }
  </code></pre>
  <p>handleHoverChart(); =&gt; this function will trigger when a user hover a dot on the chart</p>
  <pre><code>   export const handleHoverChart = (myChart, x, scaleID) =&gt; {
           const indexLine = myChart.options.annotation.annotations.findIndex(i =&gt; i.key === &quot;hoverLine&quot;)
           if (indexLine === -1) {
              myChart.options.annotation.annotations.push(convertToHoverLine(x,scaleID))
           } else {
             myChart.options.annotation.annotations[indexLine] = convertToHoverLine(x,scaleID);
             }
    myChart.update()
  }
  </code></pre>