使用Chart JS第3版。如何传入可供外部工具提示使用的自定义数据?
我想用HTML重新创建此工具提示。
我将按照本页上的“#外部(自定义)工具提示”示例进行操作:https://www.chartjs.org/docs/latest/configuration/tooltip.html但是我需要额外的数据来构建工具提示,比如图片url或产品ID?我该如何将其导入模型?
使用Chart JS第3版。如何传入可供外部工具提示使用的自定义数据?
我想用HTML重新创建此工具提示。
我将按照本页上的“#外部(自定义)工具提示”示例进行操作:https://www.chartjs.org/docs/latest/configuration/tooltip.html但是我需要额外的数据来构建工具提示,比如图片url或产品ID?我该如何将其导入模型?
2条答案
按热度按时间evrscar21#
您可以将任何自定义/高级数据放入数据集,例如(imgUrls、productIds、imgDataset):
然后,您可以使用工具提示项上下文中的datasetIndex、dataIndex来获取自定义/高级数据。
https://github.com/chartjs/Chart.js/blob/master/docs/samples/tooltip/html.md
vx6bjr1n2#
我不知道你是如何得到数据的,所以我假设你是用某种方法把它和你的普通数据放在一起的。在这种情况下,你可以向数据集添加一个自定义属性,并把它传递给工具提示。然后,它将在以下命名空间中的外部处理程序的上下文中可用:
context.tooltip.dataPoints[0].dataset[customPropertyName]
.然后,您可以创建一个图像元素并将其添加到头部:
小提琴:https://jsfiddle.net/Leelenaleee/xhrs2wvc/17/
完整代码(因为堆栈片段似乎不喜欢创建元素):
第一次