読者です 読者をやめる 読者になる 読者になる

やったこと

webサービスを作るときに考えたことを垂れ流します

chart.jsでグラフ値のポップアップが重なって表示されてしまう

chart.jsでグラフを描いてるんだけど、折れ線グラフとかでプロット数があまりに多いときに、マウスオーバーでポップアップ表示される値(tooltipと呼ばれてるらしい)がたくさん重なってしまい、かなり見苦しい様子になってしまう。

これを直すには、Chart.jsの2058行目、「pointHitDetectionRadius」の値を変えるとよい。
デフォルトは20になってるのでこれをもっと小さな値にしてあげると、マウスオーバーが反応する半径が小さくなり、ポップアップが重なりにくくなる。

この箇所です

//Number - amount extra to add to the radius to cater for hit detection outside the drawn point
pointHitDetectionRadius : 20,