Question

我正在使用Donut chartjs。工具提示文本太长而无法切割。所以我想在工具提示文本的末尾添加省略号（...）。但省略号也在传奇中添加。如何在图例和工具提示中添加不同的文字？

controller.js

doughnutData.push({
'value': value.count, color: $scope.doughNutColors[key],
highlight: $scope.doughNutColors[key], label: value.website
});

directive.js

$scope.myDoughnut = new Chart(ctx).Doughnut(value, {
                    showScale: true, scaleShowLabels: true, animation: false,
                    tooltipTemplate: "<%if (label){%><%=label%>:<%=value%>%<%}%>",
                    legendTemplate: "<ul class=\"doughnutalt-legend\"><% for (var i=0; i<segments.length; i++){%><li><span style=\"border-color:<%=segments[i].fillColor%>\"></span><label><%if(segments[i].label){%><%=segments[i].label%><%}%></label></li><%}%></ul>",
});

Answer 1

修正了它

{
...
tooltipTemplate: function (label) {
                        return customTooltip(label);
                    }

});

function customTooltip (label) {
                    if (label.label.length > 10) {
                        label.label = label.label.substring(0,10)+'...';
                    }
                    return label.label+': '+label.value+'%';
}

不知道这是否是正确的代码。但它做了我想要的事情

工具提示和图例中的自定义文本：ChartJs

1 个答案: