Question

我在显示的图表中插入选项时遇到了一些困难。

这是代码，特别值得注意的是＆＃34;选项＆＃34;部分。

var randomScalingFactor = function() 
{
    return Math.round(Math.random() * 100);
};
var randomColorFactor = function() {
    return Math.round(Math.random() * 255);
};
var randomColor = function(opacity) {
    return 'rgba(' + randomColorFactor() + ',' + randomColorFactor() + ',' + randomColorFactor() + ',' + (opacity || '.3') + ')';
};

var config = 
{
    type: 'pie',
    data: 
    {
        datasets: 
        [
            {
                data: 
                [
                    <?php
                        foreach($_responseArray as $_key => $_val)
                        {
                            echo("\"".$_val."\",");  
                        }
                    ?>
                ],

                backgroundColor: 
                [
                    "#F7464A",
                    "#46BFBD",
                    "#FDB45C",
                    "#949FB1",
                    "#4D5360",
                ],
            }
        ],
        labels:
        [
            <?php
                foreach($_responseArray as $_key => $_val)
                {
                    echo("\"".$_key."\",");  
                }
            ?>
        ]
    },
    options: 
    {
        scaleFontSize: 20,
        segmentStrokeColor : "#fff",
        responsive: true
    },

};

window.onload = function() 
{
    var ctx = document.getElementById("chart-area").getContext("2d");
    window.myPie = new Chart(ctx, config);
};

目前，这些选项都没有应用 scaleFontSize ， segmentStrokeColor ，响应，它们都不起作用。

我查看了在线documentation，提供了示例，看来这是提供选项的正确方法。但是，显然我做错了。

Answer 1

您使用的版本是v2.0。 v2.0的文档位于http://nnnick.github.io/Chart.js/docs-v2/

我不认为饼图有比例，但无论如何你可以在比例上设置它，比如说，折线图（你可能正在寻找ticks.fontSize）

需要在pie

的options属性上设置饼图边框颜色

   ...
   options: 
   {
       elements: {
           arc: {
               borderColor: 'red'
           }
       }
   }
};

请参阅https://jsfiddle.net/euq7fvg1/

responsive为真

设置Chart.js饼图选项

1 个答案: