Question

我正在玩谷歌饼图API。

一切正常，除了笔画选项：和strokeWidth :.无论我把它们设置为什么，都没有变化。

我的背景颜色很深，切片之间的线条是白色的。我正在尝试将它们更改为与背景相同的颜色。我也无法改变这些线的宽度。

这是我的代码：

<script src="https://www.google.com/jsapi"></script>
<script>

google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);

function drawChart() {

    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Task');
    data.addColumn('number', 'Hours per Day');
    data.addRows(5);
    data.setValue(0, 0, 'Work');
    data.setValue(0, 1, 11);
    data.setValue(1, 0, 'Eat');
    data.setValue(1, 1, 2);
    data.setValue(2, 0, 'Commute');
    data.setValue(2, 1, 2);
    data.setValue(3, 0, 'Watch TV');
    data.setValue(3, 1, 2);
    data.setValue(4, 0, 'Sleep');
    data.setValue(4, 1, 7);

    // Create and draw the visualization.
    new google.visualization.PieChart(document.getElementById('poll-chart')).
    draw(data, {

        title:"",
        fontSize: "12",
        legend: "none",
        width: 200,
        height: 200,
        chartArea: { left: 0, top: 0, width: "100%", height: "100%"},
        backgroundColor: { stroke: "#5A5A5A", strokeWidth: 5, fill: "#5A5A5A" }

    });
}

</script>

我从此页面上的选项中引用了Google API：

http://code.google.com/apis/chart/interactive/docs/gallery/piechart.html#Configuration_Options

我不确定我是否做错了。

非常感谢您的帮助或指导！

谢谢，迈克尔。

编辑：

好吧，所以看起来我正在弄乱的属性与整个图表的外部笔划有关，而不是每个切片。我仍然被困住了。有谁知道如何关闭切片之间的白色间隙？我在Google上找不到任何关于此事的内容。

Answer 1

使用pieSliceBorderColor。自从提出这个问题以来，可能已经添加了这个问题，但是对于将来的参考，这就是你如何做到的。注意：这只适用于2D饼图

new google.visualization.PieChart(document.getElementById('poll-chart')).
    draw(data, {

        title:"",
        fontSize: "12",
        legend: "none",
        width: 200,
        height: 200,
        chartArea: { left: 0, top: 0, width: "100%", height: "100%"},
        backgroundColor: { stroke: "#5A5A5A", strokeWidth: 5, fill: "#5A5A5A" },

        // add this line
        pieSliceBorderColor : "#5A5A5A"
    });

Google Chart API - 饼图笔触选项未生效

1 个答案: