我有一个3D堆积柱形图。 如果数据中存在较大的值,则小值将不会显示在图表中。 正如您在
中看到的那样http://jsfiddle.net/43pv1a2q/6/
series: [{
name: 'John',
data: [500, 3, 4, 7, 2], //If change 500 to 5, all blocks will be shown
stack: 'male'
}, {
name: 'Joe',
data: [300, 4, 4, 2, 5], //change 300 to 3
stack: 'male'
},
{
name: 'Tom',
data: [500, 3, 4, 7, 2], // change 500 to 5
stack: 'male'
}]
minPointLength适用于条形图,但不适用于堆积柱形图。 https://api.highcharts.com/highcharts/series.columnrange.minPointLength
如何在堆叠列中设置块的最小高度?
答案 0 :(得分:1)
这似乎是一个错误。您可以在此处报告:https://github.com/highcharts/highcharts/issues
解决方法:强>
如果原始y
值小于50
(阈值),则使用新值更新每个点,并将原始值保存在realValue
属性中。然后我手动计算tooltip.pointFormatter
中每个堆栈的累积值,以便查看者看到正确的值:
events: {
load: function() {
var chart = this,
minColHeightVal = 50;
chart.series.forEach(function(s) {
s.points.forEach(function(p) {
if (p.y < minColHeightVal) {
p.update({
y: minColHeightVal,
realValue: p.y
}, false);
}
});
});
chart.redraw();
}
}
// (...)
pointFormatter: function() {
var stackSum = 0,
point = this,
chart = point.series.chart;
chart.series.forEach(function(s) {
s.points.forEach(function(p) {
if (p.x === point.x) {
stackSum += p.realValue ? p.realValue : p.y
}
});
});
return '<span style="color:' + this.color + '">\u25CF</span> ' + this.series.name + ': ' + (point.realValue ? point.realValue : point.y) + ' / ' + stackSum;
}
答案 1 :(得分:0)
解决方案可能是将y轴设置为:logarithmic,如下所示:http://jsfiddle.net/43pv1a2q/8/
yAxis: {
type: 'logarithmic',
allowDecimals: false,
title: {
text: 'Number of fruits',
skew3d: true
}
},
我所做的唯一改变是设置“type:'logarithmic'并删除”min:0“。在处理如此巨大的差异时,我无法想到任何其他方法来实现您所寻找的数字。
编辑:当然,您仍然可以使用“min:X”来设置y轴的最小值;我刚删除它,因为当我想要最小值默认时,它是不必要的。