angularjs – 如何更改Angular Chart.js上的工具提示

发布时间：2020-12-17 08:21:39 所属栏目：安全来源：网络整理

导读：所以,我在离子应用程序上使用 angular-chart-js插件(不确定是否相关). 使用线性图表,默认情况下,当点击一个点时,我得到一个工具提示,如下所示：我想改变工具提示的内部,我在谷歌上找不到任何东西. 任何帮助表示赞赏在图表选项中,您可以为图表指定,您可以创

所以,我在离子应用程序上使用 angular-chart-js插件(不确定是否相关).

使用线性图表,默认情况下,当点击一个点时,我得到一个工具提示,如下所示：

我想改变工具提示的内部,我在谷歌上找不到任何东西.

任何帮助表示赞赏

在图表选项中,您可以为图表指定,您可以创建一个函数来返回工具提示的模板.

$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">

标签对象看起来像

label = {value: 55,label: "8/18 - 8/24",datasetLabel: "Foo",strokeColor: "rgba(178,145,47,1)",fillColor: "rgba(178,0.2)"…}

编辑：multiTooltipTemplate用于条形图,线条等,其中每个x轴值有多个数据点.对于馅饼或甜甜圈,您只需使用tooltipTemplate.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!