隐藏CanvasJS图表的标签?

时间:2017-04-25 01:49:07

标签: javascript ajax canvas pie-chart canvasjs

我有一个Canvas JS图表,如果值为0,我想隐藏标签。我的数据点中有2个非零。我的JavaScript是:

           var chart = new CanvasJS.Chart("chartContainer",
            {
                title:{
                    text: ""
                },
                legend: {
                    maxWidth: 350,
                    itemWidth: 120
                },
                data: [
                {
                    type: "pie",
                    showInLegend: true,
                    toolTipContent: "${y} - #percent %",
                    dataPoints: [
                        { y: debt, indexLabel: "Debt Payments" },
                        { y: housing, indexLabel: "Housing" },
                        { y: utilities, indexLabel: "Utilities" },
                        { y: foodandsupplies, indexLabel: "Food and Supplies"},
                        { y: transportation, indexLabel: "Transportation" },
                        { y: health, indexLabel: "Health"},
                        { y: otherDebts, indexLabel: "Other payments"}
                    ]
                }
                ]
            });
            chart.render();

JavaScript的结果是:

Pie Chart

我将不胜感激任何帮助。谢谢!

1 个答案:

答案 0 :(得分:1)

您可以通过浏览图表选项并将indexLabel设置为所有此类dataPoints的空字符串来隐藏dataPoints的indexLabels,其中零作为y值。

在渲染图表chart.render()之前添加此代码段,它应该可以正常工作。

for(var i = 0; i < chart.options.data[0].dataPoints.length; i++) {
 if(chart.options.data[0].dataPoints[i].y === 0)
  chart.options.data[0].dataPoints[i].indexLabel = "";
}

希望它有所帮助。