在Amcharts的Pie chart中,可以通过使用“labelRadius”属性将标签绘制在饼图的半径上。但是,当标签文本较长且所占的百分比较小时,它们会相互重叠并导致不可读的图表。因此,应该缩短这些标签并在工具提示中显示它们的完整文本。
以下是如何实现此目标的示例代码:
// 饼图数据 var chartData = [{ "category": "Category 1", "value": 10 }, { "category": "Category 2 with a very long label", "value": 5 }, { "category": "Category 3 with a very long label", "value": 2 }];
// 创建图表 var chart = AmCharts.makeChart("chartdiv", { "type": "pie", "theme": "light", "dataProvider": chartData, "labelRadius": -20, // 将标签绘制在半径上 "balloonText": "[[category]]: [[value]]%", // 工具提示文本 "legend": { "align": "center", "markerType": "circle" }, "export": { "enabled": true }, "dataProvider": chartData, "balloon": { "fixedPosition": true }, "listeners": [{ "event": "init", "method": function(e) { // 迭代所有数据,检查要缩短的标签 for (var i = 0; i < e.chart.dataProvider.length; i++) { // 仅针对占比小于15%的标签进行缩短 if (e.chart.dataProvider[i].value < 15) { // 将标签缩短为4个字符
上一篇:amCharts标签字体设置
下一篇:Amcharts饼图工具提示位置