当我创建堆叠条形图时,最右边的“框”没有在右侧绘制边框。
我可以在Highcharts中设置一个选项或其他东西来强制在下图中的 75% 框周围绘制白色边框线吗?
这是我用于测试的 jsfiddle 的链接:http: //jsfiddle.net/zKgsF/
请注意:将borderWidth 属性设置为大于1 可以显示,但最右边的边框比其他边框要细得多。见下图。
这是图表的javascript:
$(function () {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'bar',
backgroundColor: 'rgba(0,0,0,.3)',
margin: [15,6,15,15],
},
xAxis: {
categories: ['']
},
credits: {
enabled: false
},
yAxis: {
gridLineColor: "#FF0000",
labels:
{
align: 'right',
formatter: function()
{
return this.value + "%";
}
},
},
tooltip: {
formatter: function()
{
return "<b>" + this.series.name + '</b>: ' + this.y + ' (' + Math.round(this.percentage,1) + "%)";
}
},
plotOptions: {
bar: {
animation: false,
stacking: 'percent',
borderWidth: '1',
dataLabels: {
enabled: true,
color: 'white',
formatter: function() {
if (this.percentage < 10)
{
return ""
}
else
{
return Math.round(this.percentage,1) + "%";
}
},
style: {
fontSize: '18px'
}
}
}
},
series: [{
data: [30]
},{
data: [10]
}]
});
});
编辑:
看起来它与条形图“可堆叠”无关。这可能与图表转到最大“y”值轴的事实有关……如在另一个示例中所示:http: //jsfiddle.net/zKgsF/1/