Chartjsでクリック時にイベントを起動したい。

Question

Chartjsを使い、散布図(ScatterChart)を表示させています。
この散布図で、各ポイントをクリックした際に、それぞれの値に応じてリンクを開きたいのですが、
どのようにクリックした情報を受け取れば良いのでしょうか？

公式のドキュメントなど読んでみたのですが、なかなか上手くいかず、、
どなたかヒントでも良いので教えていただけますと幸いです。

$.getJSON("/api/test_id/", function(data) {
        var scatterChart = new Chart(ctx, {
          type: 'scatter',
          data:data,
          options: {
              scales: {
                  xAxes: [{
                    scaleLabel: {                 // 軸ラベル
                          display: true,                // 表示設定
                          labelString: '累計歩数',    // ラベル
                          fontColor: "#5e5e5e",             // 文字の色
                          fontSize: 16                  // フォントサイズ
                      },
                  }],
                  yAxes: [{
                    scaleLabel: {                 // 軸ラベル
                          display: true,                // 表示設定
                          labelString: '歩数',    // ラベル
                          fontColor: "#5e5e5e",             // 文字の色
                          fontSize: 16                  // フォントサイズ
                      },
                  }]
              },
              tooltips:{
                callbacks:{
                  label:function(tooltipItem, data){

                    return [["累計歩数：<br>" + tooltipItem.xLabel] + "<br>" + ["歩数：<br>" + tooltipItem.yLabel]];
                  },
                },
                //通常のツールチップを表示させない
                enabled:false,
                custom:function(tooltipModel){
                  // ツールチップ要素

                  var tooltipEl = document.getElementById('chartjs-tooltip');
                  // 最初のレンダリング時に要素を作成する
                  if (!tooltipEl) {
                    tooltipEl = document.createElement('div');
                    tooltipEl.id = 'chartjs-tooltip';
                    tooltipEl.innerHTML = "<table></table>";
                    document.body.appendChild(tooltipEl);
                  }
                  // ツールチップがない場合は非表示にします
                  if (tooltipModel.opacity === 0) {
                    tooltipEl.style.opacity = 0;
                    return;
                  }
                  // キャレット(ツールチップが指し示すもの)の位置を設定する
                  tooltipEl.classList.remove('above', 'below', 'no-transform');
                  if (tooltipModel.yAlign) {
                      tooltipEl.classList.add(tooltipModel.yAlign);
                  } else {
                      tooltipEl.classList.add('no-transform');
                  }
                  function getBody(bodyItem) {
                      return bodyItem.lines;
                  }
                  // テキストを設定する
                  if (tooltipModel.body) {

                      var titleLines = tooltipModel.title || [];
                      var bodyLines = tooltipModel.body.map(getBody);

                      var innerHtml = '<thead>';

                      titleLines.forEach(function(title) {
                          innerHtml += '<tr><th>' + title + '</th></tr>';
                      });
                      innerHtml += '</thead><tbody>';

                      bodyLines.forEach(function(body, i) {
                          var colors = tooltipModel.labelColors[i];
                          var style = 'background:' + colors.backgroundColor;
                          style += '; border-color:' + colors.borderColor;
                          style += '; border-width: 2px';
                          var span = '<span class="chartjs_tooltip-key" style="' + style + '"></span>';
                          innerHtml += '<tr><td>' + span + body + '</td></tr>';
                          innerHtml += '<tr><td>' + '</td></tr>';
                      });

                      innerHtml += '</tbody>';

                      var tableRoot = tooltipEl.querySelector('table');
                      tableRoot.innerHTML = innerHtml;
                  }

                  // `this` はツールチップ全体です
                  var position = this._chart.canvas.getBoundingClientRect();

                  // 表示、配置、およびフォントスタイルの設定
                  tooltipEl.style.opacity = 1;
                  tooltipEl.style.position = 'absolute';
                  tooltipEl.style.left = position.left + window.pageXOffset + tooltipModel.caretX + 'px';
                  tooltipEl.style.top = position.top + window.pageYOffset + tooltipModel.caretY + 'px';
                  tooltipEl.style.fontFamily = tooltipModel._bodyFontFamily;
                  tooltipEl.style.fontSize = tooltipModel.bodyFontSize;
                  tooltipEl.style.fontStyle = tooltipModel._bodyFontStyle;
                  tooltipEl.style.padding = tooltipModel.yPadding + 'px ' + tooltipModel.xPadding + 'px';
                  tooltipEl.style.pointerEvents = 'none';
                }
              },
              maintainAspectRatio:false,
              responsive:true
          }
        });
        **document.querySelector("#scatterChart").addEventListener('click', (e) => console.log(scatterChart.getElementsAtEvent(e)))**
      };
    });

##追記
下記コードを追加することで、クリックしたポイントのindexは取得することが出来るようになったのですが、
データをユーザーごとに分けており、datasetが複数あるためどのdatasetのindexなのかが分かりません。
これを区別することの出来る良い方法はありませんか？

document.querySelector("#scatterChart").addEventListener('click', (e) => console.log(scatterChart.getElementsAtEvent(e)))