将图表工具提示自定义为带有指向饼图段的线条的标签

时间:2015-01-29 03:09:52

标签: javascript angularjs charts google-pie-chart

我试图得到一个看起来像这样的图表,但是有价值而不是百分比:

Google Pie Chart

谷歌图表会运作良好,但据我所知,最接近你能得到的是以上内容:

legend.position = "labeled"

但你无法改变百分比值。直线也会更好,但不是必需的。

我目前正在使用chart.js并尝试使用Google图表。 chart.js有工具提示自定义,但我甚至不确定如何做一些像我的例子。

有没有人知道如何使用charts.js自定义这样的工具提示,或者知道一个易于使用且具有Angular包装器的优秀JS图表库? Google Charts和Charts.js都与Angular兼容,这是我的偏好 - 虽然它不是100%必要的。

1 个答案:

答案 0 :(得分:3)

在Google图表中,如果您想使用值而不是百分比,则可以使用labeledValueText:' value'在您的图例部分中,如下所示:

legend : { position: 'labeled', labeledValueText: 'value', textStyle: { color: 'black', fontSize: 12, } }

See example:
https://jsfiddle.net/1pyjc5bL/1/