Highcharts - Highstock "inputEditDataFormat" 打破输入
Highcharts - Highstock "inputEditDataFormat" breaking input
我正在为我的公司制作一张 highstock 图表,目前我遇到了以下问题:
我需要将 rangeSelector 输入字段更改为德语语言环境格式。例如:25.06.2016
但我注意到,一旦我在 "inputEditDateFormat" 选项中更改日期格式,它就不再起作用了。我不确定该图表是否只是混淆了月份和日期,但它没有按预期进行。
我做了一个 fiddle 让你了解我的问题。
http://jsfiddle.net/G7azG/34/
$('#container').highcharts('StockChart', {
"colors": [
"#fedd00",
"#22b6ae",
"#c0263c",
"#136e6c",
"#e2a297"
],
"legend": {
"align": "left",
"adjustChartSize": true,
"navigation": {
"enabled": false
},
"enabled": false
},
"rangeSelector": {
"selected": 4,
"inputDateFormat": "%d.%m.%Y",
"inputEditDateFormat": "%d.%m.%Y" // <-- blame this fool
},
"yAxis": {
"labels": {},
"plotLines": [
{
"value": 0,
"width": 2,
"color": "silver"
}
]
},
"plotOptions": {
"series": {
"compare": "percent",
"showInNavigator": true,
"lineWidth": 3
}
},
"tooltip": {
"pointFormat": "<span style=\"color:{series.color}\">{series.name}</span>: <b>{point.y} €/t</b> ({point.change}%)<br/>",
"valueDecimals": 2,
"split": true
},
"series": [
{
"data": [
[
1136073600000,
72.9
],
[
1138752000000,
73.6
],
[
1141171200000,
74.2
],
[
1143849600000,
75
],
[
1146441600000,
75.3
],
[
1149120000000,
75.8
],
[
1151712000000,
77.3
],
[
1154390400000,
78.6
],
[
1157068800000,
80.4
],
[
1159660800000,
82.8
],
[
1162339200000,
83.6
],
[
1164931200000,
86.5
],
[
1167609600000,
86.8
],
[
1170288000000,
84.5
],
[
1172707200000,
82.5
],
[
1175385600000,
77.6
],
[
1177977600000,
76.5
],
[
1180656000000,
76.1
],
[
1183248000000,
76.2
],
[
1185926400000,
76.2
],
[
1188604800000,
77.4
],
[
1191196800000,
81.1
],
[
1193875200000,
83.7
],
[
1196467200000,
83.6
],
[
1199145600000,
83.9
],
[
1201824000000,
81.6
],
[
1204329600000,
75.3
],
[
1207008000000,
67.6
],
[
1209600000000,
68
],
[
1212278400000,
68.2
]
],
"visible": true,
"name": "Rundholz AT"
}
]
});
编辑:
多亏了 morganfree,我才开始工作。我只需要像这样使用 inputDateParser
函数:
rangeSelector: {
inputDateFormat: "%d.%m.%Y",
inputEditDateFormat: "%d.%m.%Y",
inputDateParser: function (value) {
value = value.split('.');
console.log(value);
return Date.UTC(
parseInt(value[2]),
parseInt(value[1] - 1),
parseInt(value[0])
);
}
}
干杯;;
来自文档 inputEditDateFormat
... This must be a format that is recognized by JavaScript Date.parse.
您需要用inputDateParser解析日期。
我正在为我的公司制作一张 highstock 图表,目前我遇到了以下问题:
我需要将 rangeSelector 输入字段更改为德语语言环境格式。例如:25.06.2016
但我注意到,一旦我在 "inputEditDateFormat" 选项中更改日期格式,它就不再起作用了。我不确定该图表是否只是混淆了月份和日期,但它没有按预期进行。
我做了一个 fiddle 让你了解我的问题。 http://jsfiddle.net/G7azG/34/
$('#container').highcharts('StockChart', {
"colors": [
"#fedd00",
"#22b6ae",
"#c0263c",
"#136e6c",
"#e2a297"
],
"legend": {
"align": "left",
"adjustChartSize": true,
"navigation": {
"enabled": false
},
"enabled": false
},
"rangeSelector": {
"selected": 4,
"inputDateFormat": "%d.%m.%Y",
"inputEditDateFormat": "%d.%m.%Y" // <-- blame this fool
},
"yAxis": {
"labels": {},
"plotLines": [
{
"value": 0,
"width": 2,
"color": "silver"
}
]
},
"plotOptions": {
"series": {
"compare": "percent",
"showInNavigator": true,
"lineWidth": 3
}
},
"tooltip": {
"pointFormat": "<span style=\"color:{series.color}\">{series.name}</span>: <b>{point.y} €/t</b> ({point.change}%)<br/>",
"valueDecimals": 2,
"split": true
},
"series": [
{
"data": [
[
1136073600000,
72.9
],
[
1138752000000,
73.6
],
[
1141171200000,
74.2
],
[
1143849600000,
75
],
[
1146441600000,
75.3
],
[
1149120000000,
75.8
],
[
1151712000000,
77.3
],
[
1154390400000,
78.6
],
[
1157068800000,
80.4
],
[
1159660800000,
82.8
],
[
1162339200000,
83.6
],
[
1164931200000,
86.5
],
[
1167609600000,
86.8
],
[
1170288000000,
84.5
],
[
1172707200000,
82.5
],
[
1175385600000,
77.6
],
[
1177977600000,
76.5
],
[
1180656000000,
76.1
],
[
1183248000000,
76.2
],
[
1185926400000,
76.2
],
[
1188604800000,
77.4
],
[
1191196800000,
81.1
],
[
1193875200000,
83.7
],
[
1196467200000,
83.6
],
[
1199145600000,
83.9
],
[
1201824000000,
81.6
],
[
1204329600000,
75.3
],
[
1207008000000,
67.6
],
[
1209600000000,
68
],
[
1212278400000,
68.2
]
],
"visible": true,
"name": "Rundholz AT"
}
]
});
编辑:
多亏了 morganfree,我才开始工作。我只需要像这样使用 inputDateParser
函数:
rangeSelector: {
inputDateFormat: "%d.%m.%Y",
inputEditDateFormat: "%d.%m.%Y",
inputDateParser: function (value) {
value = value.split('.');
console.log(value);
return Date.UTC(
parseInt(value[2]),
parseInt(value[1] - 1),
parseInt(value[0])
);
}
}
干杯;;
来自文档 inputEditDateFormat
... This must be a format that is recognized by JavaScript Date.parse.
您需要用inputDateParser解析日期。