Chart.js 上的悬停模式

2024-02-29

当您未将鼠标悬停在折线图中的特定“点”上时,是否可以激活悬停?

I want that每当我将鼠标悬停在图表的任何部分上时就会激活特定的工具提示。

Edit:像这样的东西http://watchstocks.herokuapp.com/ http://watchstocks.herokuapp.com/


是的,您可以使用 Chart.js 配置工具提示以获得与您引用的图表类似的行为。

欲了解更多信息,请查看mode http://www.chartjs.org/docs/#chart-configuration-tooltip-configuration工具提示配置选项和hover http://www.chartjs.org/docs/#chart-configuration-hover-configuration满足您需求的配置选项。这是一个例子。

options: {
  responsive: true,
  title:{
    display:true,
    text:'Chart.js Line Chart'
  },
  tooltips: {
    mode: 'index',
    intersect: false,
  },
 hover: {
    mode: 'nearest',
    intersect: true
  },
  scales: {
    xAxes: [{
      display: true,
      scaleLabel: {
        display: true,
        labelString: 'Month'
      }
    }],
    yAxes: [{
      display: true,
      scaleLabel: {
        display: true,
      },
    }]
  }
}

这里有一个代码笔示例 http://codepen.io/jordanwillis/pen/ZeaLGj展示与您的示例相匹配的行为。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Chart.js 上的悬停模式 的相关文章

随机推荐

  • AVCaptureVideoDataOutput 和设置 kCVPixelBufferWidthKey & kCVPixelBufferHeightKey

    我正在尝试捕获特定尺寸的帧AVCaptureVideoDataOutput通过设置kCVPixelBufferWidthKey kCVPixelBufferHeightKey 问题是缓冲区的宽度和高度永远不会改变 它们总是会回来852x64
  • 如何修复 Google-cloud-sdk 156.0.0“您的应用程序中的文件太多,无法监控所有文件的更改。”?

    我刚刚在 osX 上安装了 Go 1 6 4 和 google cloud sdk 1 56 0 0 当我尝试运行本地 dev server 时 我收到以下警告 Users Bryan go src google cloud sdk pla
  • 使用 lxml 解析包含默认命名空间的 xml 以获取元素值

    我有一个像这样的 xml 字符串 str1
  • 是否存在具有低级前置操作的文件系统?

    在最低级别 大多数操作系统文件操作包括打开 关闭 读取 写入 删除以及查找和追加操作 但没有前置操作 出现这个问题是因为我的一位同事正在处理他生成的大型 数千兆字节 数据日志 他意识到他没有将文件头写入日志文件 尽管他只需要在文件的前面添加
  • WPF - 从 StackPanel 中删除“用户控件”子项

    我正在尝试制作一个 WPF UI 用户可以在其中编辑查询来搜索数据库 查询是根据消费者从组合框中选择的内容创建的像这样 https i stack imgur com 5ih0p png他可以创建任意数量的过滤器 只要他点击添加新条件按钮
  • 在 C 中匹配(一些)字符串的最有效方法?

    我们的系统需要接受来自终端的用户输入 并与一些已知的关键字字符串 可能是 10 个 进行匹配 我们没有空间 计算机来执行正则表达式等 代码需要小而快 现在 最糟糕的方法是 str is null terminated assume we k
  • 如何在 Ruby 中访问原始命令行参数字符串?

    我正在尝试访问 Ruby 中的原始命令行参数字符串 即 不使用预分割 分隔的 ARGV 数组 有谁知道如何做到这一点 例如 gt ruby test rb command line arguments 我希望能够判断 line 周围是否有引
  • oauth2Client.getToken 缺少刷新令牌

    我有一个小型快递服务器 有两条路线 然后它将 json 令牌写入文件 我知道非常不安全 由于某种原因没有refresh token 在文档中有一条评论offline for access type gets refresh token 已经
  • 在 Maven 构建期间将文件添加到 jar

    我试图在执行 Maven 构建时将许可证文件添加到我的所有 jar 中 我有每个类文件的许可证 但我希望将 License txt 添加到每个 jar 中的每个 META INF 文件夹 我的项目有一个主 pom 其中有六个模块 然后这些模
  • 发送相机意图后立即调用 onActivityResult

    我正在使用相机意图在我的应用程序中启动相机 但是一旦意图被触发onActivityResult被解雇了 我什至还没有拍照 当我拍照时 选择它并返回到我的活动onActivityResult根本没有被叫到 这是我启动相机的方法 Package
  • 使用 Visual Studio 构建伪语言 (qps-ploc) 附属程序集

    我已经生成了应用程序资源文件的伪本地化版本 例如Order Summary and Payment本地化为 O r d e r S u m m a r y a n d P a y m e n t 以便我们可以在获得实际翻译之前测试本地化错误
  • 如何在Reactjs中点击按钮重定向到另一个页面

    我想使用 React 创建一个基本的 Web 应用程序 我已经实现了创建按钮 我想在单击按钮时重定向到另一个页面 下面是我的 App js 代码 import React from react import logo from logo s
  • 在Python中使用PIL压缩PNG图像

    我有一个用 Selenium Builder 记录的 python 脚本 它使用以下命令获取网页的完整浏览器屏幕截图 fileName Screenshot1 png webDriverInstance save screenshot fi
  • 如何将 WooComerceAPI 集成到 React 中?

    我想通过 API 在 React 上接收数据到我的网站 我按照文档中所述执行了所有操作 执行了安装npm install save woocommerce api 使用文档中的参数创建对象http woocommerce github io
  • 无法验证包:727047181.itmsp

    我在存档文件后在应用程序商店中上传了构建版本 它将在我收到此错误时上传构建版本 1 Apple的Web服务操作不成功 2 无法验证包 727047181 itmsp 3 错误 ITMS 9000 无法更改捆绑包标识符的当前值 ue com
  • 使用 PHP 从 Google Chrome 书签导出中提取数据

    我想将我的 google chrome 书签放入数据库 所以我的第一步是使用 PHP 从 chrome 导出 html 文件并将数据放入变量中 我希望获得一些能够运行的 PHP 代码下面的数据 它会将 URL ADD DATE ICON 和
  • 无法通过管道以自定义方式重命名下载的图像

    我使用 python 的 scrapy 模块创建了一个脚本 从 torrent 站点下载并重命名电影图像 并将它们存储在 scrapy 项目内的文件夹中 当我按原样运行脚本时 我发现它正确地下载了该文件夹中的图像 此时 脚本正在使用 req
  • javascript从所选国家/地区值中选择城市

    我有来自这里的国家数据库http www webmasterworld com html 3018309 htm http www webmasterworld com html 3018309 htm有239个国家 每个国家都有价值 在选
  • 这个指针类型防水吗?

    我正在尝试设计一种自定义类型 可以在需要窗口句柄或其他类型指针的 API 中使用 并且适用于 VBA 可以运行的所有系统 这是我所得到的 If Win64 1 And VBA7 0 Then Public Type LongLong 64
  • Chart.js 上的悬停模式

    当您未将鼠标悬停在折线图中的特定 点 上时 是否可以激活悬停 I want that每当我将鼠标悬停在图表的任何部分上时就会激活特定的工具提示 Edit 像这样的东西http watchstocks herokuapp com http w