如何仅在钻取饼上显示数据标签?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何仅在钻取饼上显示数据标签?相关的知识,希望对你有一定的参考价值。

嘿家伙我已经对饼图进行了条形图钻取,因此其中有一个名为“plotOptions”和“datalabels”的东西,数据标签显示每个条形/切片的值,但我希望数据标签只显示在饼图上图表而不是条形图当前它在条形图上显示如下:enter image description here

正如您可以看到值“264.50%”和“164.50”,我不想显示该值。但我不能从代码中删除数据标签,否则它也不会在我的饼图上显示我。

那我怎么能只从条形图中删除它?我的代码如下:

<script>

Highcharts.chart('container', {
    chart: {
        type: 'column'
    },
    title: {
        text: 'Chart'
    },
    xAxis: {
        type: 'category'
    },
    yAxis: {
        title: {
            text: ''
        }

    },
    legend: {
        enabled: false
    },
    plotOptions: {
        series: {
            borderWidth: 0,
            dataLabels: {
                enabled: true,
                formatter: function () {
                    var mychart = $('#container').highcharts();
                    var mytotal = 0;

                    for (i = 0; i < mychart.series.length; i++) {
                        if (mychart.series[i].visible) {
                            mytotal = {!! $countTotalRecord['low confidence'] !!} + {!! $countTotalRecord['no answer'] !!} + {!! $countTotalRecord['missing intent'] !!} + {!! $countTotalRecord['webhook fail'] !!};
                        }
                    }
                    var pcnt = (this.y / mytotal) * 100;
                    return Highcharts.numberFormat(pcnt) + '%';
                }
            }
        }
    },

    tooltip: {
        // headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
        pointFormat: '{point.name}: <b>{point.y}</b>'
    },

    credits:{
      enabled: false
    },

    series: [{
        name: 'front',
        colorByPoint: true,
        data: [{
            name: 'Total',
            y: {!! $countTotalRecord['total'] !!},
            drilldown: 'total'
        }, {
            name: 'Match',
            y: {!! $countTotalRecord['match'] !!},
            drilldown: 'match'
        }]
    }],
    drilldown: {
        series: [{
            name: 'total',
            id: 'total',
            type:'pie',
            data: [
                [
                    'Low Confidence',
                    {!! $countTotalRecord['low confidence'] !!}
                ],
                [
                    'No Answer',
                    {!! $countTotalRecord['no answer'] !!}
                ],
                [
                    'Missing Intent',
                    {!! $countTotalRecord['missing intent'] !!}
                ],
                [
                    'Webhook Fail',
                    {!! $countTotalRecord['webhook fail'] !!}
                ]
            ]
        }]
    }
});

</script>
答案

您可以在任何您不想看到数据标签的关卡系列中传递dataLables enable false

 series: [{
    name: 'Brands',
    colorByPoint: true,
    data: [{....}],
    dataLabels: {
            enabled: false,
        }
   }],

http://jsfiddle.net/fw3bdjzw/

以上是关于如何仅在钻取饼上显示数据标签?的主要内容,如果未能解决你的问题,请参考以下文章

如何仅在最后一个栏显示 chartjs 数据标签?

仅在一个片段中隐藏状态栏并在其他片段中显示

仅在父片段中的操作栏中显示搜索视图

如何在PIE图表中显示图表从图表到饼图钻取高图

数据库向下钻取

ListFragment 仅在带有 ExpandableListadpater 的片段视图中显示第一项