我想改变Chart.js在使用index模式时呈现工具提示的方式。默认情况下，Chart.js会显示每个数据集的工具提示之间的分行符。我需要改变这种行为。
我尝试使用label回调函数，但似乎Chart.js对每个数据集都调用了一次函数，而不是在合并工具提示之后。
当前工具提示显示：
所需工具提示显示：
我想这样做的原因是，我的图形可以包含大量的数据集，工具提示框的高度超过了图形的高度，并且在发生这种情况时会被截断。
谢谢。
浏览 1提问于2019-03-22得票数 1
回答已采纳
1回答
自定义位置工具提示在顶部
、、、、
我正在尝试使这个示例工作：
因为它有一个选项将工具提示定位在图形的底部。我需要这样做，因为我有太多的数据在我的图表和当我移动我的光标，工具提示摆动太多。我最大的问题是，即使在我的脚本标记中添加了type=“模块”之后，当我从‘/chart.js/dist/chart.js’导入{Tooltip}时仍然会出现以下错误：
Uncaught :所请求的模块'/chart.js/dist/chart.js‘不提供名为“工具提示”的导出。
而这甚至是在失去了3个小时试图搜索谷歌的每个角落之后。非常感谢任何人能帮助我！
浏览 3提问于2022-06-12得票数 2
回答已采纳
2回答
我正在尝试使用NG2图表Angular2指令为Chart.js构建一个甜甜圈图。这个chart.js有默认的工具提示定位选项，我想让工具提示显示在图表之外。有什么办法让它成为可能吗？
public doughnutChartOptions = {
responsive: true,
tooltips:{
mode: 'nearest',
}
}
我希望像工具提示这样的东西会显示在图表之外，而不是显示在图表中；顶部、底部和侧面。
浏览 0提问于2019-07-31得票数 1
回答已采纳
我正在使用chart.js显示一个线条图。如何隐藏chart.js线条图的工具提示标签？工具提示中的标签正在显示undefined，所以我想隐藏标签(请看屏幕截图)？
也许有一种方法可以修改工具提示，在这里我只能在工具提示中显示传奇值？我的代码如下：
myLine = new Chart(ctx).Line(lineChartData, {
type: 'line',
responsive: true,
scaleShowGridLines : false,
bezierCurve : false,
animati
浏览 10提问于2016-02-16得票数 2
回答已采纳
当此代码运行时：
// index.svelte
import Chart, { Tooltip } from 'chart.js/auto.esm';
console.log({ Tooltip });
Tooltip成功地输出到控制台，但我也得到了一个错误(在浏览器中)：
请求的模块'/node_modules/.vite/chart_js_auto.js?v=9674d8be‘不提供名为“工具提示”的导出。
因此，SvelteKit显然是多次运行此代码。为什么它只工作一次，然后就失败了呢？我怎么才能让它一直工作？
我导入了'chart.js/
浏览 3提问于2022-02-08得票数 2
回答已采纳
我试图在同一个页面上使用绘制两个以上的图表，并在循环中创建一个动态div，其中包含图表的所有数据，如下所示：
<div class="col-4">
<canvas class="trend-chart" id="chart{{ p.sNo }}" width="500" height="100" role="img" data-pv="{{ p.recentPageViews }}">
</canvas>
</div>
浏览 17提问于2021-12-23得票数 2
问题
有没有办法在Chart.js气泡图中添加单个气泡的标签而不需要在任何时候都显示工具提示？
背景
图表数据用于可视化我们的项目待办事项。关于每个项目的其他详细信息，即项目名称，都在一个表中。
我们以前使用过google图表，只是在气泡中包含了表中的行号，这样就可以匹配内容了。
使用Chart.js，我只得到泡泡和工具提示。
我已经回顾了以下相关问题，但他们建议的解决方案需要随时显示工具提示。我在工具提示中获得了更多的信息，并且一直显示它们会使图表变得非常混乱。
浏览 11提问于2016-12-21得票数 7
回答已采纳
如何使chart.js工具提示以下列方式工作：
示例：
我需要工具提示在图表上的任何一点，而不仅仅是在数据点上。
浏览 1提问于2018-07-17得票数 3
回答已采纳
1回答
我正在使用chart.js，我很难显示我的工具提示。工具提示背景颜色变暗，用户无法阅读其中的文本。我试过改变背景和字体颜色，但是什么都没有用。
浏览 0提问于2015-09-29得票数 0
我试图使用chart.js创建一个条形图与自定义的html工具提示。我想在工具提示中包括一些交互的内容。问题是，默认情况下，当鼠标离开图表画布时，工具提示的不透明度为0。我需要覆盖mouseout事件，这样用户就可以与工具提示交互。
官方文件很好，但不全面.我找不到官方的答案，所以我求助于审查开源代码和我的开发工具。
使用Google的开发工具，我可以点击画布，查看事件侦听器选项卡。在鼠标底下，我看到了以下情况：
canvas#chart_0.dashboard-chart.chartjs-render-monitor chart.js 10969
在开发人员工具中删除此侦听器将修复此问题
浏览 0提问于2019-05-06得票数 2
回答已采纳
我正在尝试实现下面显示在第一张图片中的工具提示。在工具提示中，我需要显示yAxes和xAxes数据。我使用的chart.js版本是3.7.0
我的工具提示如下：
我正在尝试复制的工具提示：
chart.js文档对我来说很难理解。有什么大师可以向我解释。
问题：为什么我的工具提示返回yAxes数据，而我作为变量返回(label)作为未定义的？
还有其他选项可以让我的图表看起来像第二张图片中的图表吗？
我的代码
tooltip: {
displayColors: false,
backgroundColor: 'rgba(45,132,180,0.8)&#
浏览 3提问于2021-12-30得票数 4
回答已采纳
我可以用chart.js绘制普通条形图。不过，我想画一个条形图如下。
我查阅了chart.js的文档，但没有结果，也在网上进行了广泛的搜索，但没有发现任何提示。几乎所有的问题都会导致条形图中有多个颜色条。
浏览 4提问于2017-02-22得票数 2
回答已采纳
1回答
我正试图将一个自定义的Chart.js工具提示放在两个条形图的中间。我对chart.js文档和不同的帖子进行了研究，但没有发现任何不同的方法，而是使用以下代码段定位它(我使用jquery并执行一个切换类来隐藏/显示工具提示，请关注我用来定位工具提示的值)：
function setupTooltipPosition(config) {
const { tooltipElement, tooltipModel } = config;
const leftOffset = this._chart.canvas.offsetLeft;
const topOffset = this._ch
浏览 0提问于2018-10-10得票数 0
回答已采纳
我正在用chart.js实现一些点图。没有问题，但我想做的是有一个工具提示，而不仅仅是附加到给定的数据点。现在，您可以创建一个工具提示，它将在图表上的给定数据点附近显示一个弹出窗口。例如，如果我有数据点1、5、2、6和3,7，它将很高兴地显示这三个数据点。
但我想要的是当我在1,5和2,6之间时，看看我在x轴上的确切位置1.5、1.6等。
在chart.js调用的工具提示选项中，我可以这样做：
tooltips: { mode: 'index', intersect: false, callbacks: { footer: functio
浏览 83提问于2017-07-07得票数 4
回答已采纳
想要在chart.js的工具提示中添加% sign怎么办？
var chart = new chart(ctx,{
type:'bar',
data : data
});
浏览 2提问于2017-09-20得票数 0
我想在饼形工具提示中显示多个值。示例：
恐怖: 30%
行动: 45%
喜剧: 15%
戏剧: 10%
当悬停在该部分时，应在工具提示中显示。
这在Chart.js或其他库中是可能的吗？
请帮帮忙。谢谢。
浏览 4提问于2015-05-27得票数 0
回答已采纳
1回答
我在做一些研究，我想知道是否有可能像在chart.js中那样做一个定制的工具提示，我什么也找不到。我想添加一些css到我的工具提示！我正在使用angular5。
浏览 1提问于2018-10-30得票数 3
我在官方文档中包含了使用示例的chart.js自定义工具提示。
问题：，如果有人在图表上有鼠标，则显示此自定义工具提示。当鼠标在图表中时，如果有人使用选项卡/enter导航到另一个页面，则不会调用此自定义工具提示函数。因此，在与app的其余交互中，工具提示不会从UI中删除。我已经检查了核心库，我认为它只是检测mouseout事件，在本例中没有调用这个自定义工具提示钩子。
下面所附的是我的工具提示配置代码，我使用react-chartjs-2包装器来使用chart.js Chart.js版本: 2.9.1 react 2: 2.8.0
tooltips: {
enab
浏览 1提问于2020-06-12得票数 0
默认情况下，Chart.js将在条形图的顶部显示工具提示。我试图将工具提示的默认位置从顶部更改到栏的中心。
这是一些类似的东西，如下图所示。
谢谢你在这方面的帮助。
浏览 5提问于2020-11-18得票数 0
2回答
如何始终使用Chart.js版本2 (alpha)显示工具提示？
我尝试过这个，但似乎在最后一个版本中发生了变化。
浏览 3提问于2015-07-06得票数 3
Chart.js 3.7.1如何总是显示工具提示？
，，我想用的是总显示。
和文本只应在今天的日期变黑。
就像这张照片。
请帮帮我..。
浏览 5提问于2022-10-06得票数 2
我在我的项目中使用了Chart.js 2.0。
我想要更改折线图的工具提示模板。默认情况下为Chart.defaults.global.multiTooltipTemplate = "<%if (datasetLabel){%><%=datasetLabel%>: <%}%><%= value %>"。但将multiTooltipTemplate的值更改为"<%= value %>"后，工具提示不会更新。
那么我做错了什么呢？
浏览 1提问于2016-04-13得票数 0
1回答
如何用Chart.js生成PDF
、、、、
我正在开发一个网页应用程序在Symfony4上，我需要生成与Chart.js创建的图表。对于PDF，我使用的是mPDF，但它不能呈现这样的图表...我的想法是创建一个由chart.js生成的图表截图，然后将其作为png传递给mPDF，但我不确定如何实现这一点。 如果我的想法是正确的，你能给我一个提示吗？
浏览 15提问于2019-09-19得票数 0
我使用的是chart.js v2.5.0。
我的项目要求是使用“从右到左”方向的工具提示。
我如何才能做到这一点？
浏览 0提问于2017-05-18得票数 3
1回答
我使用的是原始饼图，基于chart.js，有些情况下我不想显示任何标签。在这种情况下，当我将鼠标悬停在图表上时，会得到一个未定义标签的工具提示显示。
在没有标签的情况下，如何关闭工具提示？
浏览 14提问于2018-07-26得票数 0
我正在使用Chart.js库构建一个图表。考虑以下Chart.js折线图：
因此，这里使用了两个数据集，一个用于红线，一个用于绿线。我想隐藏其中的一个数据集，例如红色的那个。这将导致红线不显示我想要的。
但是，我还希望工具提示应该显示两个数据集(包括隐藏的数据集)的数据。
这有可能吗？
浏览 14提问于2020-02-24得票数 0
回答已采纳
1回答
配置雷达图w/Chart.js
、、、、
编辑:下面的答案部分得到了回答，但它帮助我找到了最终的解决方案。Fiddle已经更新了我想要的。
这是我正在做的雷达图：
Chart.defaults.global.defaultFontColor = "#eee";
var radarData = {
labels: [ "Passing", "Positioning", "Stickhandling", "Wristship",
"Determination", "Acceleration", "Speed
浏览 1提问于2017-05-01得票数 2
回答已采纳
我正在尝试让工具提示始终显示在Chart.js v3中的甜甜圈上。有什么方法可以做到这一点吗？
浏览 21提问于2021-05-28得票数 0
我已经使用Chart.js制作了一个饼图，并且我想要检测一个片段何时被悬停。我已经找到了大量关于在段上悬停时操作工具提示的文档，但是在工具提示出现时却没有做任何其他的事情。这个是可能的吗？
浏览 11提问于2015-03-26得票数 9
回答已采纳
是否有一个Chart.js选项来增加从其工具提示变为活动点的距离？
默认情况下，一个点是“活动的”，当鼠标直接悬停在一个点上时，就会显示工具提示。我想给用户一个更多的区域周围点，使他们“活跃”。
谢谢!
浏览 0提问于2017-06-19得票数 8
回答已采纳
1回答
是否可以更改气泡chart.js图表的工具提示中显示的数据集标签？
目前，dataset是基于x,y,r值的，但是我想注入一些额外的内容，这样它不是读取(5,55,27.5)，而是类似于：(Day:5, Total:55)。我想在工具提示中去掉27.5的半径。
浏览 1提问于2017-07-22得票数 1
在我的一个项目中，我使用Chart.JS进行一些与图形相关的工作。其中我对图例、记号、scaleLabel和工具提示使用不同的字体大小。在大型设备上一切正常，但当我在移动设备上测试图形时，问题就出现了。字体大小变得太大。所以我的计划是使用两种不同的字体大小来解决这个问题。 但是，我没有在chart.js中找到任何选项来使用多种字体大小，或者没有选项来使用px以外的任何其他单位。 有人能帮我解决如何为chart.js调整不同设备上的字体大小吗？
浏览 16提问于2021-01-11得票数 0
我正在使用chart.js生成一个图表。一切都很好！
但是如何格式化工具提示信息呢？应该是: 28.04.2020 - 05:00
浏览 7提问于2020-04-28得票数 3
回答已采纳
我的雷达的工具提示是显示“标签”，但我希望雷达的工具提示显示“数据”。 我参考了chart.js官网的方法，但仍然不能正确显示 My Radar chart Chart.js official website Radar chart 我的代码版本 "dependencies": {
"chart.js": "^2.9.3",
"chartkick": "^3.2.0",
"core-js": "^3.3.2",
"hchs-vue-charts": "^1.
浏览 24提问于2020-01-21得票数 0
回答已采纳
我有一个有两个数据集的线图。最初，Y轴是0-100.第一条线大约是一条大约70的直线，第二条线都在30下面。如果我通过强制Y轴最小为65和最大值75 (即我想检查垂直展开的第一行)将图表垂直缩放，那么当我悬停在数据点上时，工具提示就会丢失。实际上，我认为它是在图表之外的(可以说:-)。
工具提示似乎自动定位在最低数据点和最高数据点之间，即使其中一个数据点远低于图表。
我的问题是:这是一个错误，还是我可以告诉chart.js在确定工具提示垂直位置时忽略图表上的数据点的方法？
如果工具提示总是处于固定的垂直位置(横过图表顶部或垂直于图表中心)，我甚至会很高兴。
使用chart.js V2.7.1
浏览 0提问于2018-08-23得票数 1
回答已采纳
因此，我正在使用Chart.js中的条形图，并尝试使用自定义工具提示。搜索一下，似乎在这个上下文中要做的事情是添加
tooltipTemplate: "<%= value %>% test"
添加到我的选项部分，这将在结果工具提示中的数据值之后显示单词test。然而，我的工具提示在现实中完全保持不变。还有想法呢？
谢谢!
浏览 13提问于2016-07-28得票数 4
回答已采纳
我正在使用Chart.js根据设计师的特定方向构建折线图，并且我希望我的工具提示中包含一个小图标。
有可能吗？
浏览 3提问于2015-06-16得票数 3
我使用chart.js这里- 创建了spidar (雷达)图.当数据= 100,100,100,200这样时，所有三个标签的节点都会相互重叠，所以在这个例子中，工具提示只显示一个标签，就像在演示中看到的那样。
如何解决重叠节点的工具提示问题？
浏览 5提问于2020-07-03得票数 1
回答已采纳
我想在标签和工具提示中隐藏Chart.js中的传说。
我使用的是2.5.0版本
我试着这样做，但它没有隐藏在工具提示中的传说。
<canvas id="myChart" width="400" height="250"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>
<script>
window.onload = fu
浏览 3提问于2017-03-29得票数 1
回答已采纳
我希望将工具提示只显示在右边的最后一个数据上，就像附加的图像一样。
数据可以是5个或更多。
我为解决这个问题做了很多努力，但还是解决不了。
最后一个数据的工具提示应该始终保持可见，当鼠标悬停时也应该显示其他工具提示。
请使用chart.js库提供帮助。
浏览 9提问于2022-08-04得票数 0
1回答
是否有可能防止工具提示在单击线条图本身时消失？我希望它在最近点击的数据池中总是可见的。
我在vue中使用chart.js 3.9.1
谢谢:)
浏览 4提问于2022-12-03得票数 0
3回答
在角JS和chart.js中，可以在悬停时显示工具提示，甚至在单击bar时调用函数(假设您使用的是来自chart.js的条形图)。
但是，当您单击条形图时，可以调用指令吗？或者我应该使用canvas.js来完成这个任务？
我所指的指令是自定义的，它弹出为包含一些值的窗口。它不必是指令，它甚至可以是在单击图表中的一个条形后调用的角分量。
浏览 3提问于2020-02-10得票数 3
回答已采纳
1回答
我使用的是Chart.js，而且我似乎无法在工具提示文本中插入分行符。我试过\n但这似乎对我不起作用。不然我该怎么做呢？
浏览 2提问于2015-06-27得票数 1
回答已采纳
我将Chart.js与Angular2结合使用。我正在输入(x，y)坐标。其中x是时间戳，y是不同的值。工具提示显示时间戳，而不是我希望看到的时间格式。在这里，我已经做了代码，请看看，并帮助我。。
我很容易理解x轴是如何显示时间的。Chart.js文档是可怕的，而且很难理解，我所有的怀疑都依赖于堆栈溢出。
下面是打印日期的图表选项。我无法理解在这里写什么工具提示选项。
private options = {
scales: {
xAxes: [{
tooltipFormat:'',
type: 't
浏览 0提问于2017-04-27得票数 2
回答已采纳
当相应的图例键悬停时，我试图显示带有图形数据(label和y值)的工具提示。我只能找到适用于较早版本的Chart.js的解决方案，我正在使用3.8.0。
浏览 3提问于2022-06-28得票数 0
回答已采纳
我正在尝试使用chart.js将工具提示隐藏在一行图中。
我试过这段代码，但他们从不隐藏。
Chart.defaults.global.tooltipenabled = false;
您可以在这里看到图表的所有代码：
，谢谢！
浏览 4提问于2016-04-30得票数 60
回答已采纳
1回答
我正在使用react-chartjs-2库在React中制作简单的图表。我试图通过添加一个标题来定制工具提示：
tooltips: {
callbacks: {
label: (tooltipItem, data) => {
return tooltipItem?.value + ' test';
}
}
}
代码沙箱：
尽管我遵循了chart.js示例和许多其他自定义工具提示示例(即来自这个问题的答案： )，但代码不起作用。
浏览 4提问于2021-08-27得票数 3
回答已采纳
我在Node中创建了一个名为chart.js的类文件，它依赖于moment.js和一堆其他外部依赖项：
var moment = require('moment');
...
var Chart = {
doSomething: function() {
} ...
};
module.exports = Chart;
现在我想在我的index.js文件中使用这个chart.js模块，所以我按如下方式导入它：
var chart = require('chart');
chart.doSomething();
但这会给我带来导入错误：
Referenc
浏览 1提问于2015-05-28得票数 2
是否可以为Chart.js图表中的每个数据集值定义HTML5数据属性？目标是使用与目标数据集值相关的附加信息来增强默认工具提示信息(例如，X轴值和Y轴值)。 在下面的示例中，显示了一个图表，其中显示了6个孩子使用的尿布总数。当工具提示显示时，它会显示孩子的名字和尿布数量。我希望工具提示也能显示年龄和性别，并且工具提示回调可以从附加到每个数据集值的数据属性中获取这些信息。 我已经查看了Chart.js文档，并搜索了StackOverflow等在线论坛，但都没有成功。 var myChart = new Chart(document.getElementById('myChart'
浏览 15提问于2019-08-31得票数 1
回答已采纳
1回答
工具提示覆盖图表js中的文本
、、、、
我使用chart.js创建了一个图，如下所示
上面的图--类似于文本(裸的，挂载的)--我在oncomplete函数中创建了如下
onComplete: function () {
// render the value of the chart above the bar
var ctx = this.chart.ctx;
ctx.font = Chart.helpers.fontString(Chart.defaults.global.defaultFontSize, 'normal', Chart.defaults.global.def
浏览 2提问于2016-12-30得票数 1
回答已采纳
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM
腾讯云开发者
