当我使用特定的日期时间格式时,使用 CanvasJS 的图形为空
Graph using CanvasJS is empty when I use specific dateTime format
我正在使用 CanvasJS
在我的页面中显示图表。 x
包含日期和 y
数字..
我设置:
xValueType: "dateTime",
xValueFormatString: "YYYY-MM-DD HH:mm",
格式化我的日期,例如'2018-11-08 13:11'
但图表是空的.. dateFormat 有问题,但我不知道是什么...
window.onload = function() {
var chart = new CanvasJS.Chart("grafima1", {
animationEnabled: true,
title: {
text: "title"
},
axisX: {
title: "date"
},
axisY: {
title: "Num",
suffix: "",
stripLines: [{
value: 3,
label: "3"
}]
},
data: [{
type: "line",
name: "Ώρες",
connectNullData: true,
xValueType: "dateTime",
xValueFormatString: "YYYY-MM-DD HH:mm",
yValueFormatString: "#,##0.##",
dataPoints: [{
x: '2018-11-08 13:11',
y: 2.0
},
{
x: '2018-11-05 15:23',
y: 5.0
}
]
}]
});
chart.render();
};
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="grafima1" style="height: 370px; width: 100%;"></div>
window.onload = function () {
var chart = new CanvasJS.Chart("grafima1", {
animationEnabled: true,
title: {
text: "title"
},
axisX: {
title: "date"
},
axisY: {
title: "Num",
suffix: "",
stripLines: [{
value: 3,
label: "3"
}]
},
data: [{
type: "line",
name: "Ώρες",
connectNullData: true,
xValueType: "dateTime",
xValueFormatString: "YYYY-MM-DD HH:mm",
yValueFormatString: "#,##0.##",
dataPoints: [{
x: new Date("2018-11-08 13:11"),
y: 2.0
},
{
x: new Date("2018-11-05 15:23"),
y: 5.0
}
]
}]
});
chart.render();
};
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="grafima1" style="height: 370px; width: 100%;"></div>
我正在使用 CanvasJS
在我的页面中显示图表。 x
包含日期和 y
数字..
我设置:
xValueType: "dateTime",
xValueFormatString: "YYYY-MM-DD HH:mm",
格式化我的日期,例如'2018-11-08 13:11'
但图表是空的.. dateFormat 有问题,但我不知道是什么...
window.onload = function() {
var chart = new CanvasJS.Chart("grafima1", {
animationEnabled: true,
title: {
text: "title"
},
axisX: {
title: "date"
},
axisY: {
title: "Num",
suffix: "",
stripLines: [{
value: 3,
label: "3"
}]
},
data: [{
type: "line",
name: "Ώρες",
connectNullData: true,
xValueType: "dateTime",
xValueFormatString: "YYYY-MM-DD HH:mm",
yValueFormatString: "#,##0.##",
dataPoints: [{
x: '2018-11-08 13:11',
y: 2.0
},
{
x: '2018-11-05 15:23',
y: 5.0
}
]
}]
});
chart.render();
};
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="grafima1" style="height: 370px; width: 100%;"></div>
window.onload = function () {
var chart = new CanvasJS.Chart("grafima1", {
animationEnabled: true,
title: {
text: "title"
},
axisX: {
title: "date"
},
axisY: {
title: "Num",
suffix: "",
stripLines: [{
value: 3,
label: "3"
}]
},
data: [{
type: "line",
name: "Ώρες",
connectNullData: true,
xValueType: "dateTime",
xValueFormatString: "YYYY-MM-DD HH:mm",
yValueFormatString: "#,##0.##",
dataPoints: [{
x: new Date("2018-11-08 13:11"),
y: 2.0
},
{
x: new Date("2018-11-05 15:23"),
y: 5.0
}
]
}]
});
chart.render();
};
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="grafima1" style="height: 370px; width: 100%;"></div>