Javascript HighCharts-使饼图成为100%的div

我如何制作

div

中包含的

pie

图表填充

100%

？

div

的宽度为

198px

，高度为

152px

另外，我想在每个饼片中都有一个

线性梯度
效果，你能建议怎么做吗

您可以通过在饼图的
plotOptions
中设置
size
属性，并从图表中删除
边距
、
间距
和
标题
来实现饼图的全高

代码

    chart: {           
        margin: [0, 0, 0, 0],
        spacingTop: 0,
        spacingBottom: 0,
        spacingLeft: 0,
        spacingRight: 0
    },
    plotOptions: {
        pie: {
            size:'100%',
            dataLabels: {
                enabled: false
            }
        }
    }

示例（将小提琴更新为2.2.4版）

这里有一个例子来说明这一点

至于线性渐变，我不知道它们是否已经实现，但这里有一个显示径向渐变的示例

径向渐变现在也是Highcharts 3.0的一部分，下面是一个

更新

    chart: {           
        margin: [0, 0, 0, 0],
        spacingTop: 0,
        spacingBottom: 0,
        spacingLeft: 0,
        spacingRight: 0
    },
    plotOptions: {
        pie: {
            size:'100%',
            dataLabels: {
                enabled: false
            }
        }
    }

从Highcharts 3.0开始，由于绘图区域内的图表自动缩放，这不再可能，这是他们文档的摘录：

大小：饼图相对于绘图区域的直径。可以是百分比或像素值。像素值以整数形式给出默认行为（从3.0开始）是缩放到绘图区域，并为绘图区域内的数据标签留出空间。因此，当更新点和数据标签时，饼图的大小可能会有所不同。在这种情况下，最好设置一个固定值，例如“75%”。默认为

在我看来，情况不应该如此，因为
数据标签
被禁用。可能应记录为

更新（2014年8月）

根据评论，这确实仍然是可能的。除了边距开始设置外，还需要设置为
0
。()
$（函数（）{
$（“#容器”）。高图({
标题：空，
图表：{
键入“pie”，
保证金：0
},
打印选项：{
馅饼：{
切片偏移量：0，
大小：“100%”，
数据标签：{
已启用：false
}
}
},
系列：[{
数据：[
['Firefox'，44.2]，
[IE7'，26.6]，
[IE6'，20]，
[Chrome'，3.1]，
[“其他”，5.4]
]
}]
});
});
#容器{
轮廓：1px纯红；
填充：0；
}

我的解决方案；（图例位置余量顶部错误…）

你能生成提琴样本吗？渐变可能会有点痛，因为您可能需要使用辐射渐变。应使用辐射渐变覆盖“背景”属性（确保背景颜色是透明的）。我们需要查看一些HTML，以便告诉您如何调整它，因为仅仅是highchart中的一张图片就非常糟糕：P除非我们转到highcharts.org，否则不是；）我在highcharts上记录了一个关于此回归的问题：您需要将chart.margin和series.slicingOffset设置为0：非常感谢Torstein！注意：如果系列名称已更新，因此无法与图表匹配，则图例将调整大小以适应内部，图表将调整大小（缩小），无论设置的大小。@epoch，是否知道这在以后的highchart版本（即5+）中是否仍然可行？请正确格式化代码并将其放入代码块中。看见