如何使用piecelabel.js包含chart.js的值和百分比

Question

我不确定如何在饼图的标签上同时包含值和百分比。

Chart.js v：2.5.0 PieceLabel.js版本：1.0.1

<script type="text/javascript" src="/common/chart.js/chart.min.js"></script>
    <script type="text/javascript" src="/common/chart.js/chart.piecelabel.js"></script>
    <script type="text/javascript" src="/common/chart.js/pallet.js"></script>

    <canvas id="myChart" width="400" height="400"></canvas>

    <script>

        $(document).ready(function(){

            var ctx = $("#pie-chart");

        //Chart options
            var ctxOptions = {
                rotation: 0,
                cutoutPercentage:50,
                responsive: true,
                legend: { position: 'top',
                          labels: { fontColor: '#111', fontSize: 22}
                },

                title: { display: true, text: 'Shop Load Hours', fontSize: 20, fontColor:"#111" },

                plugins: {

                //this is for piecelabel
                    labels: {
                        showZero: true,
                        fontSize: 16,
                        fontColor: '#000',
                        fontStyle: 'bold',
                        borderText:true,
                        render: 'percent'
                    } //end labels

                } //end plugins
            };

        //Chart data
            var ctxData = {
                    labels: [<?php echo $chart_labels; ?>],
                    datasets: [{
                        data: [<?php echo $chart_data; ?>],
                            backgroundColor: palette('mpn65', <?php echo count($total_hours_array); ?> ).map(function(hex) {
                                return '#' + hex;
                            })
                    }]
            };


            var pieChart = new Chart(ctx, {
                type: 'pie',
                data: ctxData,
                options: ctxOptions,
                         defaultFontColor: '#000'
            }); //end Chart declaration


        }); //end document ready

    </script>

我认为这与将标签中的render函数设置为一个函数有关，但是我不知道该怎么做。从文档中：

    // custom render
{
  render: function (args) {
    // args will be something like:
    // { label: 'Label', value: 123, percentage: 50, index: 0, dataset: {...} }
    return '$' + args.value;

    // return object if it is image
    // return { src: 'image.png', width: 16, height: 16 };
  }
}

我需要它同时在标签中显示值和百分比。