var chartDateOnly = AmCharts.makeChart("date-only", {
"type": "serial",
"marginRight": 40,
"marginLeft": 40,
"autoMarginOffset": 20,
"dataDateFormat": "YYYY-MM-DD",
"valueAxes": [{
"id": "v1",
"axisAlpha": 0,
"position": "left",
"ignoreAxisWidth":true,
"stackType":"regular",
}],
"graphs": [{
"id": "g1",
"connect": false,
"lineThickness": 2,
"title": "red line",
"valueField": "value",
"valueAxis":"v1",
},
{
"id": "g2",
"connect": false,
"lineThickness": 2,
"title": "blue line",
"valueField": "value2",
"valueAxis":"v1",
}],
"categoryField": "date",
"categoryAxis": {
"parseDates": true,
},
"dataProvider": [{
"date": "2012-07-29T10:00:00.000Z",
"value": 15,
"value2":null,
}, {
"date": "2012-07-30T10:00:00.000Z",
"value": 26,
"value2":null,
}, {
"date": "2012-07-31T10:00:00.000Z",
"value": 18,
"value2":null,
}, {
"date": "2012-08-01T10:00:00.000Z",
"value": null,
"value2": 50,
}, {
"date": "2012-08-02T10:00:00.000Z",
"value": null,
"value2":55,
}, {
"date": "2012-08-03T10:00:00.000Z",
"value": null,
"value2": 70,
}, {
"date": "2012-08-04T10:00:00.000Z",
"value": 20,
"value2":null,
}, {
"date": "2012-08-05T10:00:00.000Z",
"value": 17,
"value2":null,
}]
});
var chartDateTime = AmCharts.makeChart("date-time", {
"type": "serial",
"marginRight": 40,
"marginLeft": 40,
"autoMarginOffset": 20,
"dataDateFormat": "YYYY-MM-DDTHH:NN:SS.QQQZ", // Specify time format
"valueAxes": [{
"id": "v1",
"axisAlpha": 0,
"position": "left",
"ignoreAxisWidth":true,
"stackType":"regular",
}],
"graphs": [{
"id": "g1",
"connect": false,
"lineThickness": 2,
"title": "red line",
"valueField": "value",
"valueAxis":"v1",
},
{
"id": "g2",
"connect": false,
"lineThickness": 2,
"title": "blue line",
"valueField": "value2",
"valueAxis":"v1",
}],
"categoryField": "date",
"categoryAxis": {
"parseDates": true,
"minPeriod": "mm", // specify minutes
},
"dataProvider": [{
"date": "2012-07-29T10:00:00.000Z",
"value": 15,
"value2":null,
}, {
"date": "2012-07-30T10:00:00.000Z",
"value": 26,
"value2":null,
}, {
"date": "2012-07-31T10:00:00.000Z",
"value": 18,
"value2":null,
}, {
"date": "2012-08-01T10:30:00.000Z",
"value": null,
"value2": 50,
}, {
"date": "2012-08-02T10:30:00.000Z",
"value": null,
"value2":55,
}, {
"date": "2012-08-03T10:30:00.000Z",
"value": null,
"value2": 70,
}, {
"date": "2012-08-04T10:00:00.000Z",
"value": 20,
"value2":null,
}, {
"date": "2012-08-05T10:00:00.000Z",
"value": 17,
"value2":null,
}]
});
<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="https://www.amcharts.com/lib/3/serial.js"></script>
<script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
<link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
<!-- HTML -->
<div id="date-only" style="width:100%;height:500px;"></div>
<div id="date-time" style="width:100%;height:500px;"></div>