如何改变角度chart.js之提示 [英] How to change tooltip on Angular Chart.js
问题描述
所以,我使用角图-JS 插件上的离子应用程序(不知道这有关)。
So, I'm using angular-chart-js plugin on an ionic app (Not sure if that relevant).
通过线性图表,默认情况下,在点击一个点,当我得到一个提示,如下所示:
With linear chart, by default, when clicking on a dot I get a tooltip as shown:
和我想改变这种提示里面,我找不到对谷歌任何东西。
And I want to change the inside of that tooltip, I couldn't find anything on google.
任何帮助是pciated AP $ P $
Any help is appreciated
推荐答案
在图表选项,您可以指定一个图表,你可以创建一个函数返回一个模板的提示。
In the chart options you can specify for a chart, you can create a function to return a template for the tooltip.
$scope.chart_options = {
multiTooltipTemplate: function(label) {
return label.label + ': ' + label.value;
}
}
和在您的视图:
<canvas id="" class="chart chart-bar" legend="true"
series="bar_series" colours="colors"
data="bar_data" labels="bar_labels"
options="chart_options">
标签物体看起来像
The label object looks like
label = {value: 55, label: "8/18 - 8/24", datasetLabel: "Foo",
strokeColor: "rgba(178,145,47,1)", fillColor: "rgba(178,145,47,0.2)"…}
编辑: multiTooltipTemplate
用于棒,线等,在这里你有每个x轴值的多个数据点。对于饼图或圆环,你只需要使用 tooltipTemplate
。
The multiTooltipTemplate
is used for bar, line, etc, where you have multiple data points for each x axis value. For pie or doughnut, you would just use tooltipTemplate
.
这篇关于如何改变角度chart.js之提示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!