我正在尝试自定义Highcharts饼图切片的选择状态,以便在选择时它不会移出。HighCharts 选择状态文档为选择状态提供了一个"半径"选项,但这些设置对饼图没有影响:
$(function () {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'pie'
},
plotOptions: {
series: {
allowPointSelect: true,
marker: {
states: {
select: {
radius: 0,
fillColor: '#666'
}
}
}
}
},
series: [{
data: [['Jan', 29.9], ['Feb', 71.5], ['Mar', 106.4], ['Apr', 129.2], ['May', 144.0], ['Jun', 176.0], ['Jul', 135.6], ['Aug', 148.5], ['Sep', 216.4], ['Oct', 194.1], ['Nov', 95.6], ['Dec', 54.4]]
}]
});
});
请参阅工作示例。
以下示例说明了如何更改所选切片的颜色,但未记录这些设置,并且添加"radius"属性不起作用:
$(function () {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'pie'
},
plotOptions: {
series: {
allowPointSelect: true,
states: {
select: {
color: '#666'
}
}
}
},
series: [{
data: [['Jan', 29.9], ['Feb', 71.5], ['Mar', 106.4], ['Apr', 129.2], ['May', 144.0], ['Jun', 176.0], ['Jul', 135.6], ['Aug', 148.5], ['Sep', 216.4], ['Oct', 194.1], ['Nov', 95.6], ['Dec', 54.4]]
}]
});
});
查看工作示例
有没有人设法禁用饼图切片选择动画,同时仅将填充颜色应用于所选切片?
感谢 Sebastian 和 Pawel 在 Highcharts 支持论坛上的帮助,切片动画通过"切片偏移量:0"设置被禁用:
$(function () {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'pie'
},
plotOptions: {
series: {
allowPointSelect: true,
slicedOffset: 0,
states: {
select: {
color: '#666'
}
}
}
},
series: [{
data: [['Jan', 29.9], ['Feb', 71.5], ['Mar', 106.4], ['Apr', 129.2], ['May', 144.0], ['Jun', 176.0], ['Jul', 135.6], ['Aug', 148.5], ['Sep', 216.4], ['Oct', 194.1], ['Nov', 95.6], ['Dec', 54.4]]
}]
});
});
查看工作示例
基本上,您希望每当单击饼图时,单击的切片都不应消失。 所以简单地这样做:
allowPointSelect: false,
它将停止该切片出去,无需设置任何切片偏移量这是一个 JsFiddle