如何使用 Chart.js 为折线图中的线段启用工具提示

发布于 2025-01-13 13:10:45 字数 736 浏览 1 评论 0原文

当我将鼠标悬停在数据点上时,我可以配置折线图工具提示。但是,如果将鼠标悬停在两个数据点之间的线段上,我还想显示一些数据。 我正在使用的代码如下:

callbacks: {
                  label: function (context) {
                    var value = labels[context.dataIndex];
                    for (var i = 0; i < flares.length; i++) {
                      // console.log(labels[ctx.p0DataIndex], flares[i]);
                      if (
                        value >= flares[i].Starttime &&
                        value <= flares[i].Endtime
                      ) {
                        return "Peak-Score : " + flares[i].PeakScore;
                      }
                    }

                    return "No flares";
                  },
                },
'''

I am able to configure the line chart tooltip when I hover over the datapoint. However, I would also like to show some data if hover is over the line segment between two data points.
Code I am using is as follows :

callbacks: {
                  label: function (context) {
                    var value = labels[context.dataIndex];
                    for (var i = 0; i < flares.length; i++) {
                      // console.log(labels[ctx.p0DataIndex], flares[i]);
                      if (
                        value >= flares[i].Starttime &&
                        value <= flares[i].Endtime
                      ) {
                        return "Peak-Score : " + flares[i].PeakScore;
                      }
                    }

                    return "No flares";
                  },
                },
'''

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文