xyz*_*124 2 javascript charts bar-chart highcharts
我正在使用 Highcharts,并且有这个简单的条形图:
数据中的最大值为 27,但在规模上为 40。如何将 yAxis.max 设置为提供的数据中的最大值?在此示例中为 27,而不是 40。
老实说,我什至不需要图表上的这些值,但我想强制具有最大值的条形占据 100% 的可用高度。
数据将动态提供,因此我不能仅手动设置最大值。
这是我当前的代码:
Highcharts.chart('container', {
chart: {
type: 'column',
height: 150,
},
yAxis: {
title: {
text: null,
},
labels: {
enabled: true,
},
},
xAxis: {
title: {
text: null,
},
},
credits: false,
legend: false,
title: {
text: null,
},
series: [{
data: [1, 0, 27, 7]
}]
});Run Code Online (Sandbox Code Playgroud)
#container {
min-width: 310px;
max-width: 800px;
height: 400px;
margin: 0 auto
}Run Code Online (Sandbox Code Playgroud)
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/series-label.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container"></div>Run Code Online (Sandbox Code Playgroud)
这是jsfiddle: http: //jsfiddle.net/de3qfb3r/
您说您不关心图表上的值,所以也许添加 endOnTick: false 对您来说就足够了:
yAxis: {
title: {
text: null,
},
labels: {
enabled: true,
},
endOnTick: false
}
Run Code Online (Sandbox Code Playgroud)
Highcharts 自动计算最大值并将其适合可用高度。当 endOnTick 为 true 时(这是默认值),它会添加一个额外的空格以勾号结束
| 归档时间: |
|
| 查看次数: |
4751 次 |
| 最近记录: |