防止面积图 Y 轴从零开始
Prevent Area plot Y-axis from starting with ZERO
Y 轴不从零开始而是从接近 HighCharts/HighStock 中最低 Y 轴数据点的值开始的配置是什么?
这是图表的演示,它具有非常大的 Y 轴数据值,而最小 Y 轴绘图点为零:http://jsfiddle.net/ubnjjups/
和演示中使用的示例配置:
{
series: [{
type: 'area',
data: [
[1375660800000, 106861],
[1375747200000, 107397],
[1375833600000, 108674],
[1375920000000, 108792],
[1376006400000, 110504],
[1376265600000, 110658],
[1376352000000, 110792]
]
}],
}
这里的问题是您使用的 'area' 类型根据定义需要显示从 0 到点的区域。如果你切换到 'spline',它会自动执行你想要的操作。
$(function () {
$('#container').highcharts('StockChart', {
series: [{
type: 'spline',
data: [[1375660800000, 106861],[1375747200000, 107397],[1375833600000, 108674],[1375920000000, 108792],[1376006400000, 110504],[1376265600000, 110658],[1376352000000, 110792],[1376438400000, 111095],[1376524800000, 112334],[1376611200000, 112775],[1376870400000, 113051],[1376956800000, 113426],[1377043200000, 113516]]
}],
});
});
更新:
如果你想继续使用面积图(所以你在下方填充了面积),我建议你在你的 yAxis 上使用 min。我已经在此处更改了您的代码
$(function () {
$('#container').highcharts('StockChart', {
series: [{
type: 'area',
data: [[1375660800000, 106861],[1375747200000, 107397],[1375833600000, 108674],[1375920000000, 108792],[1376006400000, 110504],[1376265600000, 110658],[1376352000000, 110792],[1376438400000, 111095],[1376524800000, 112334],[1376611200000, 112775],[1376870400000, 113051],[1376956800000, 113426],[1377043200000, 113516]]
}],
yAxis:{
min: 105000
}
});
});
当您从服务器取回数据并计算您的最小值点时,可以提前计算min值。希望这有帮助。
根据@Vadim 的回答,截至今天,我建议计算 yAxis.min
配置本身内部的最低 Y 轴值,以保持代码的一致性和可移植性。唯一的要求是将数据提取到图表初始化之外的变量中。
对于格式为 <Timestamp>, <Y-axis value>
的数据,以下将有效:
var data = [
[1375660800000, 106861],
[1375747200000, 107397],
[1375833600000, 108674]
];
$('#container').highcharts('StockChart', {
series: [{
type: 'area',
data: data
}],
yAxis: {
min: (function() {
var min = data[0][1];
for (var i = 0; i < data.length; i++) {
var value = data[i][1];
if (value < min) {
min = value;
}
}
return min;
})()
}
});
Y 轴不从零开始而是从接近 HighCharts/HighStock 中最低 Y 轴数据点的值开始的配置是什么?
这是图表的演示,它具有非常大的 Y 轴数据值,而最小 Y 轴绘图点为零:http://jsfiddle.net/ubnjjups/
和演示中使用的示例配置:
{
series: [{
type: 'area',
data: [
[1375660800000, 106861],
[1375747200000, 107397],
[1375833600000, 108674],
[1375920000000, 108792],
[1376006400000, 110504],
[1376265600000, 110658],
[1376352000000, 110792]
]
}],
}
这里的问题是您使用的 'area' 类型根据定义需要显示从 0 到点的区域。如果你切换到 'spline',它会自动执行你想要的操作。
$(function () {
$('#container').highcharts('StockChart', {
series: [{
type: 'spline',
data: [[1375660800000, 106861],[1375747200000, 107397],[1375833600000, 108674],[1375920000000, 108792],[1376006400000, 110504],[1376265600000, 110658],[1376352000000, 110792],[1376438400000, 111095],[1376524800000, 112334],[1376611200000, 112775],[1376870400000, 113051],[1376956800000, 113426],[1377043200000, 113516]]
}],
});
});
更新:
如果你想继续使用面积图(所以你在下方填充了面积),我建议你在你的 yAxis 上使用 min。我已经在此处更改了您的代码
$(function () {
$('#container').highcharts('StockChart', {
series: [{
type: 'area',
data: [[1375660800000, 106861],[1375747200000, 107397],[1375833600000, 108674],[1375920000000, 108792],[1376006400000, 110504],[1376265600000, 110658],[1376352000000, 110792],[1376438400000, 111095],[1376524800000, 112334],[1376611200000, 112775],[1376870400000, 113051],[1376956800000, 113426],[1377043200000, 113516]]
}],
yAxis:{
min: 105000
}
});
});
当您从服务器取回数据并计算您的最小值点时,可以提前计算min值。希望这有帮助。
根据@Vadim 的回答,截至今天,我建议计算 yAxis.min
配置本身内部的最低 Y 轴值,以保持代码的一致性和可移植性。唯一的要求是将数据提取到图表初始化之外的变量中。
对于格式为 <Timestamp>, <Y-axis value>
的数据,以下将有效:
var data = [
[1375660800000, 106861],
[1375747200000, 107397],
[1375833600000, 108674]
];
$('#container').highcharts('StockChart', {
series: [{
type: 'area',
data: data
}],
yAxis: {
min: (function() {
var min = data[0][1];
for (var i = 0; i < data.length; i++) {
var value = data[i][1];
if (value < min) {
min = value;
}
}
return min;
})()
}
});