删除饼图图例(amcharts4)中名称和百分比之间的空格

时间:2019-04-07 12:02:49

标签: legend pie-chart amcharts legend-properties amcharts4

enter image description here

我想消除图例中名称和百分比之间的空格。在图片中,我用黄色突出显示了该空间。

例如,我希望第一个图例项目为“立陶宛(30.5%)”。 “立陶宛”和“ 30.5%”之间的多余空间破坏了我的用户界面。

我的图例代码如下:

// Add and configure Series
var pieSeries = chart.series.push(new am4charts.PieSeries());
pieSeries.dataFields.value = "litres";
pieSeries.dataFields.category = "country";
pieSeries.slices.template.stroke = am4core.color("#fff");
pieSeries.slices.template.strokeWidth = 2;
pieSeries.slices.template.strokeOpacity = 1;
pieSeries.ticks.template.disabled = true;
pieSeries.labels.template.disabled = true;

// This creates initial animation
pieSeries.hiddenState.properties.opacity = 1;
pieSeries.hiddenState.properties.endAngle = -90;
pieSeries.hiddenState.properties.startAngle = -90;

pieSeries.legendSettings.labelText = '{category}';
pieSeries.legendSettings.valueText = null;
pieSeries.labels.template.text = "{category}: {value}";
pieSeries.slices.template.tooltipText = "{category}: {value}";

chart.legend = new am4charts.Legend();
chart.legend.fontSize = 5;
chart.legend.markers.template.width = 5;
chart.legend.markers.template.height = 5;

要完成此操作,我必须进行哪些更改?

1 个答案:

答案 0 :(得分:2)

您可以将值移动到 respond_to do |format| format.html format.pdf do render pdf: 'report', template: 'download_report.pdf.erb', show_as_html: params[:debug].present?, layout: 'report_application.pdf', margin: { top: 5, bottom: 5, left: 5, right: 5 } end end

"labelText"

并完全禁用值标签:

pieSeries.legendSettings.labelText = "{category}: {value.percent.formatNumber('#.0')}%";