我有一个columnrange
图表。两条水平网格线之间的垂直距离取决于我绘制的点数。
例如,如果我有 6 个点在不同的垂直高度,则网格距离会更大,如果我将网格点增加到 10-12,则距离会减小。
我理解这是因为,在上述两种情况下,图表试图通过调整两条网格线之间的垂直距离来适应整个高度。
但是,是否可以固定 gridLines 距离而不考虑要绘制的点数,并相应地调整图表容器的整体高度。
我试过了:
xAxis:{
labels:{
distance:10 //fixed
}
}
修复 tickInterval
也无济于事。
我还尝试将 height:auto
赋给我的图表容器,但这没有用。
虽然修复 gridLines 之间的距离似乎很基本,但不知何故我没有完成它。请有人帮忙。演示在这里 http://jsfiddle.net/ay1Lk2yw/2/
最佳答案
您可以计算您的图表应该有多大并调整它的大小,这样网格线之间的距离将保持不变。
var gridLinesDistance = 20, //in pixels
top = chart.plotTop,
bottom = chart.spacing[2],
axis = chart.xAxis[0],
range = axis.dataMax - axis.dataMin + 1,
newHeight = top + range * gridLinesDistance + bottom;
$("#container").height(newHeight + 'px');
chart.reflow(); //adjust the chart to the new size
关于javascript - 如何修复 HighCharts 中的列范围网格距离?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39509645/