带有日期时间轴的 AmCharts 在 2PM 之后显示 12PM

我有一个带有日期时间类别轴的 chartJson,类别值作为字符串解析为日期时间值。dataDateFormat 提供为“YYYY-MM-DD LL:NN:SS A”,因为我的日期是上午/下午的 12 小时格式。12PM 的值在 2PM 值之后绘制,即使 12PM 出现在 2PM 之前。我怎样才能解决这个问题?


代码笔链接:https ://codepen.io/shank9717/pen/xxxWMMN


数据示例:


“数据提供者”:[


{

  "value1": "1",

  "alteredText": "2019-09-20 1...",

  "key": "2019-09-20 12:22:03 pm"

},

{

  "value1": "2",

  "alteredText": "2019-09-20 0...",

  "key": "2019-09-20 01:24:03 pm"

},

{

  "value1": "3",

  "alteredText": "2019-09-26 1...",

  "key": "2019-09-26 12:40:03 am"

},

{

  "value1": "4",

  "alteredText": "2019-10-11 1...",

  "key": "2019-10-11 12:09:09 pm"

},

{

  "value1": "1004",

  "alteredText": "2019-10-11 0...",

  "key": "2019-10-11 02:53:20 pm"

},

{

  "value1": "2004",

  "alteredText": "2019-10-11 0...",

  "key": "2019-10-11 03:35:31 pm"

}]

"dataDateFormat": "YYYY-MM-DD LL:NN:SS A"


FFIVE
浏览 242回答 2
2回答

慕尼黑的夜晚无繁华

将日期字符串更改为实际日期值。将图表数据分配给变量。将每个日期字符串更改为一个日期,然后将变量分配给图表选项中的数据提供者。将图表数据分配给变量。var chartData = [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "1",&nbsp; &nbsp; &nbsp; "alteredText": "2019-09-20 1...",&nbsp; &nbsp; &nbsp; "key": "2019-09-20 12:22:03 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "2",&nbsp; &nbsp; &nbsp; "alteredText": "2019-09-20 0...",&nbsp; &nbsp; &nbsp; "key": "2019-09-20 01:24:03 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "3",&nbsp; &nbsp; &nbsp; "alteredText": "2019-09-26 1...",&nbsp; &nbsp; &nbsp; "key": "2019-09-26 12:40:03 am"&nbsp; &nbsp; },&nbsp; &nbsp; ...将每个日期字符串更改为日期chartData.forEach(function (row, index) {&nbsp; row.key = new Date(row.key);&nbsp; chartData[index] = row;});然后将变量分配给图表选项中的数据提供者。"dataProvider": chartData,请参阅以下工作片段...var chartData = [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "1",&nbsp; &nbsp; &nbsp; "alteredText": "2019-09-20 1...",&nbsp; &nbsp; &nbsp; "key": "2019-09-20 12:22:03 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "2",&nbsp; &nbsp; &nbsp; "alteredText": "2019-09-20 0...",&nbsp; &nbsp; &nbsp; "key": "2019-09-20 01:24:03 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "3",&nbsp; &nbsp; &nbsp; "alteredText": "2019-09-26 1...",&nbsp; &nbsp; &nbsp; "key": "2019-09-26 12:40:03 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "4",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-11 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-11 12:09:09 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "1004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-11 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-11 02:53:20 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "2004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-11 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-11 03:35:31 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "3004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-12 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-12 03:06:21 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "4004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-13 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-13 03:57:25 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "5004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-13 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-13 04:33:30 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "6004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-13 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-13 04:57:14 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "14009",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-13 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-13 06:50:11 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "7006",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-13 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-13 07:35:02 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "8004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 11:49:04 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "8005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 12:00:19 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "16013",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 12:07:20 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "18009",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 12:31:28 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "9006",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 12:41:22 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "20009",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 01:00:22 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "22009",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 02:19:18 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "12004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 03:59:39 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "13004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 07:10:26 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "13005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 07:24:20 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "14004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 07:42:55 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "15004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 10:09:20 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "30011",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 10:18:20 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "15007",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 10:22:20 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "16004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 01:04:33 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "17004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 03:22:05 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "18004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 08:06:00 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "18005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 08:13:22 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "19004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 08:31:22 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "20004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 09:04:32 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "21004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 09:25:24 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "21005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 09:34:19 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "21006",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 09:44:19 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "22004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 09:52:22 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "23004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 06:31:26 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "23005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 06:45:58 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "23006",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 06:50:01 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "24004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 07:15:59 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "24005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 07:19:01 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "48013",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 07:28:59 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "25004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-17 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-17 09:02:50 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "25005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-17 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-17 09:08:02 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "26004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-17 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-17 05:11:58 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "27004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-17 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-17 07:39:58 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "28004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-17 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-17 08:55:58 pm"&nbsp; &nbsp; }&nbsp; ];chartData.forEach(function (row, index) {&nbsp; row.key = new Date(row.key);&nbsp; chartData[index] = row;});var chart = AmCharts.makeChart( "chartdiv",{&nbsp; "categoryAxis": {&nbsp; &nbsp; "axisAlpha": 1,&nbsp; &nbsp; "gridAlpha": 0,&nbsp; &nbsp; "parseDates": true,&nbsp; &nbsp; "gridPosition": "start",&nbsp; &nbsp; "minPeriod": "ss",&nbsp; &nbsp; "labelsEnabled": false,&nbsp; &nbsp; "position": "bottom",&nbsp; &nbsp; "autoWrap": true,&nbsp; &nbsp; "title": "xaxis"&nbsp; },&nbsp; "rotate": false,&nbsp; "balloon": {&nbsp; &nbsp; "adjustBorderColor": false,&nbsp; &nbsp; "offsetX": 0,&nbsp; &nbsp; "offsetY": 0,&nbsp; &nbsp; "fixedPosition": true,&nbsp; &nbsp; "cornerRadius": 0,&nbsp; &nbsp; "maxWidth": 130&nbsp; },&nbsp; "allLabels": [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "size": 13,&nbsp; &nbsp; &nbsp; "x": "8",&nbsp; &nbsp; &nbsp; "y": "-1",&nbsp; &nbsp; &nbsp; "bold": true,&nbsp; &nbsp; &nbsp; "text": "",&nbsp; &nbsp; &nbsp; "align": "left"&nbsp; &nbsp; }&nbsp; ],&nbsp; "valueAxes": [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "gridAlpha": 0,&nbsp; &nbsp; &nbsp; "axisAlpha": 1,&nbsp; &nbsp; &nbsp; "offset": 0,&nbsp; &nbsp; &nbsp; "usePrefixes": true,&nbsp; &nbsp; &nbsp; "precision": 0,&nbsp; &nbsp; &nbsp; "labelsEnabled": true,&nbsp; &nbsp; &nbsp; "logarithmic": false,&nbsp; &nbsp; &nbsp; "position": "left",&nbsp; &nbsp; &nbsp; "id": "series1",&nbsp; &nbsp; &nbsp; "title": "yaxis"&nbsp; &nbsp; }&nbsp; ],&nbsp; "numberFormatter": {&nbsp; &nbsp; "precision": 0,&nbsp; &nbsp; "thousandsSeparator": ""&nbsp; },&nbsp; "titles": [],&nbsp; "type": "serial",&nbsp; "dataDateFormat": "YYYY-MM-DD LL:NN:SS A",&nbsp; "chartScrollbar": {&nbsp; &nbsp; "oppositeAxis": false,&nbsp; &nbsp; "scrollbarHeight": 4&nbsp; },&nbsp; "categoryField": "key",&nbsp; "graphs": [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "valueAxis": "series1",&nbsp; &nbsp; &nbsp; "maxBulletSize": 0,&nbsp; &nbsp; &nbsp; "lineColorField": "color1",&nbsp; &nbsp; &nbsp; "bulletSize": 5,&nbsp; &nbsp; &nbsp; "thickness": 2,&nbsp; &nbsp; &nbsp; "lineThickness": 2,&nbsp; &nbsp; &nbsp; "bulletColor": "#FFFFFF",&nbsp; &nbsp; &nbsp; "fillColorsField": "color1",&nbsp; &nbsp; &nbsp; "precision": 0,&nbsp; &nbsp; &nbsp; "lineColor": "#ef7b31",&nbsp; &nbsp; &nbsp; "useLineColorForBulletBorder": true,&nbsp; &nbsp; &nbsp; "fillColors": "#ef7b31",&nbsp; &nbsp; &nbsp; "valueField": "value1",&nbsp; &nbsp; &nbsp; "title": "clf_id",&nbsp; &nbsp; &nbsp; "balloonText": "<span style='font-size:11px'><b>[[value]]</b></span>",&nbsp; &nbsp; &nbsp; "minBulletSize": 0,&nbsp; &nbsp; &nbsp; "legendValueText": " ",&nbsp; &nbsp; &nbsp; "bulletBorderAlpha": 1,&nbsp; &nbsp; &nbsp; "hideBulletCount": 50,&nbsp; &nbsp; &nbsp; "noStepRisers": false,&nbsp; &nbsp; &nbsp; "bullet": "round",&nbsp; &nbsp; &nbsp; "labelRotation": 0,&nbsp; &nbsp; &nbsp; "connect": true&nbsp; &nbsp; }&nbsp; ],&nbsp; "fontFamily": "Arial",&nbsp; "responsive": {&nbsp; &nbsp; "enabled": true&nbsp; },&nbsp; "usePrefixes": false,&nbsp; "theme": "light",&nbsp; "fontSize": 11,&nbsp; "dataProvider": chartData,&nbsp; "prefixesOfBigNumbers": [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "number": "1000",&nbsp; &nbsp; &nbsp; "prefix": " K"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "number": "1000000",&nbsp; &nbsp; &nbsp; "prefix": " Mn"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "number": "1000000000",&nbsp; &nbsp; &nbsp; "prefix": " Bn"&nbsp; &nbsp; }&nbsp; ],&nbsp; "chartCursor": {&nbsp; &nbsp; "valueBalloonsEnabled": true,&nbsp; &nbsp; "oneBalloonOnly": true,&nbsp; &nbsp; "categoryBalloonEnabled": true,&nbsp; &nbsp; "cursorAlpha": 0&nbsp; },&nbsp; "addClassNames": true,&nbsp; "export": {&nbsp; &nbsp; "fileName": "Line Chart",&nbsp; &nbsp; "columnNames": {&nbsp; &nbsp; &nbsp; "key": "clf_polled_dttm"&nbsp; &nbsp; },&nbsp; &nbsp; "exportFields": [&nbsp; &nbsp; &nbsp; "key",&nbsp; &nbsp; &nbsp; "value1"&nbsp; &nbsp; ],&nbsp; &nbsp; "enabled": true&nbsp; },&nbsp; "marginTop": 50});body {&nbsp; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";}#chartdiv {&nbsp; width: 100%;&nbsp; height: 500px;}<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/amstock.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" /><div id="chartdiv"></div>

尚方宝剑之说

AmCharts V3并没有支持AM / PM和12小时日期格式dataDateFormat。注意:由星号LL和A和下面的注意事项:* dataDateFormat 设置不支持带星号的格式化代码。图表将无法解析数据中基于字符串的日期中的那些。您需要事先将数据转换为使用 24 小时格式,以便 AmCharts 使用 进行解析dataDateFormat,或者使用像 moment.js 这样的库将这些日期解析Date为 AmCharts 使用的对象。我建议不要Date按照 WhiteHat 的回答中的建议直接使用构造函数,因为规范仅保证ISO8601 或 RFC-2822 时间戳将起作用,而您的格式不太适合。如果您打算在数组上使用 moment,那么以下代码将起作用:[&nbsp; /* your data array */].map(function(item) {&nbsp; &nbsp; return {&nbsp; &nbsp; &nbsp; "value1": item.value1,&nbsp; &nbsp; &nbsp; "alteredText": item.alteredText,&nbsp; &nbsp; &nbsp; "key": moment(item.key, "YYYY-MM-DD hh:mm a").toDate()&nbsp; &nbsp; }&nbsp; })演示如下:var chartData = [];var chart = AmCharts.makeChart( "chartdiv",&nbsp;{&nbsp; "categoryAxis": {&nbsp; &nbsp; "axisAlpha": 1,&nbsp; &nbsp; "gridAlpha": 0,&nbsp; &nbsp; "parseDates": true,&nbsp; &nbsp; "gridPosition": "start",&nbsp; &nbsp; "minPeriod": "ss",&nbsp; &nbsp; "labelsEnabled": false,&nbsp; &nbsp; "position": "bottom",&nbsp; &nbsp; "autoWrap": true,&nbsp; &nbsp; "title": "xaxis"&nbsp; },&nbsp; "rotate": false,&nbsp; "balloon": {&nbsp; &nbsp; "adjustBorderColor": false,&nbsp; &nbsp; "offsetX": 0,&nbsp; &nbsp; "offsetY": 0,&nbsp; &nbsp; "fixedPosition": true,&nbsp; &nbsp; "cornerRadius": 0,&nbsp; &nbsp; "maxWidth": 130&nbsp; },&nbsp; "allLabels": [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "size": 13,&nbsp; &nbsp; &nbsp; "x": "8",&nbsp; &nbsp; &nbsp; "y": "-1",&nbsp; &nbsp; &nbsp; "bold": true,&nbsp; &nbsp; &nbsp; "text": "",&nbsp; &nbsp; &nbsp; "align": "left"&nbsp; &nbsp; }&nbsp; ],&nbsp; "valueAxes": [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "gridAlpha": 0,&nbsp; &nbsp; &nbsp; "axisAlpha": 1,&nbsp; &nbsp; &nbsp; "offset": 0,&nbsp; &nbsp; &nbsp; "usePrefixes": true,&nbsp; &nbsp; &nbsp; "precision": 0,&nbsp; &nbsp; &nbsp; "labelsEnabled": true,&nbsp; &nbsp; &nbsp; "logarithmic": false,&nbsp; &nbsp; &nbsp; "position": "left",&nbsp; &nbsp; &nbsp; "id": "series1",&nbsp; &nbsp; &nbsp; "title": "yaxis"&nbsp; &nbsp; }&nbsp; ],&nbsp; "numberFormatter": {&nbsp; &nbsp; "precision": 0,&nbsp; &nbsp; "thousandsSeparator": ""&nbsp; },&nbsp; "titles": [],&nbsp; "type": "serial",&nbsp; //"dataDateFormat": "YYYY-MM-DD LL:NN:SS A",&nbsp; "chartScrollbar": {&nbsp; &nbsp; "oppositeAxis": false,&nbsp; &nbsp; "scrollbarHeight": 4&nbsp; },&nbsp; "categoryField": "key",&nbsp; "graphs": [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "valueAxis": "series1",&nbsp; &nbsp; &nbsp; "maxBulletSize": 0,&nbsp; &nbsp; &nbsp; "lineColorField": "color1",&nbsp; &nbsp; &nbsp; "bulletSize": 5,&nbsp; &nbsp; &nbsp; "thickness": 2,&nbsp; &nbsp; &nbsp; "lineThickness": 2,&nbsp; &nbsp; &nbsp; "bulletColor": "#FFFFFF",&nbsp; &nbsp; &nbsp; "fillColorsField": "color1",&nbsp; &nbsp; &nbsp; "precision": 0,&nbsp; &nbsp; &nbsp; "lineColor": "#ef7b31",&nbsp; &nbsp; &nbsp; "useLineColorForBulletBorder": true,&nbsp; &nbsp; &nbsp; "fillColors": "#ef7b31",&nbsp; &nbsp; &nbsp; "valueField": "value1",&nbsp; &nbsp; &nbsp; "title": "clf_id",&nbsp; &nbsp; &nbsp; "balloonText": "<span style='font-size:11px'><b>[[value]]</b></span>",&nbsp; &nbsp; &nbsp; "minBulletSize": 0,&nbsp; &nbsp; &nbsp; "legendValueText": " ",&nbsp; &nbsp; &nbsp; "bulletBorderAlpha": 1,&nbsp; &nbsp; &nbsp; "hideBulletCount": 50,&nbsp; &nbsp; &nbsp; "noStepRisers": false,&nbsp; &nbsp; &nbsp; "bullet": "round",&nbsp; &nbsp; &nbsp; "labelRotation": 0,&nbsp; &nbsp; &nbsp; "connect": true&nbsp; &nbsp; }&nbsp; ],&nbsp; "fontFamily": "Arial",&nbsp; "responsive": {&nbsp; &nbsp; "enabled": true&nbsp; },&nbsp; "usePrefixes": false,&nbsp; "theme": "light",&nbsp; "fontSize": 11,&nbsp; "dataProvider": [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "1",&nbsp; &nbsp; &nbsp; "alteredText": "2019-09-20 1...",&nbsp; &nbsp; &nbsp; "key": "2019-09-20 12:22:03 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "2",&nbsp; &nbsp; &nbsp; "alteredText": "2019-09-20 0...",&nbsp; &nbsp; &nbsp; "key": "2019-09-20 01:24:03 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "3",&nbsp; &nbsp; &nbsp; "alteredText": "2019-09-26 1...",&nbsp; &nbsp; &nbsp; "key": "2019-09-26 12:40:03 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "4",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-11 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-11 12:09:09 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "1004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-11 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-11 02:53:20 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "2004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-11 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-11 03:35:31 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "3004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-12 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-12 03:06:21 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "4004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-13 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-13 03:57:25 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "5004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-13 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-13 04:33:30 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "6004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-13 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-13 04:57:14 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "14009",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-13 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-13 06:50:11 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "7006",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-13 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-13 07:35:02 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "8004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 11:49:04 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "8005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 12:00:19 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "16013",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 12:07:20 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "18009",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 12:31:28 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "9006",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 12:41:22 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "20009",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 01:00:22 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "22009",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 02:19:18 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "12004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 03:59:39 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "13004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 07:10:26 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "13005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 07:24:20 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "14004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-14 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-14 07:42:55 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "15004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 10:09:20 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "30011",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 10:18:20 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "15007",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 1...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 10:22:20 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "16004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 01:04:33 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "17004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 03:22:05 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "18004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 08:06:00 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "18005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 08:13:22 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "19004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 08:31:22 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "20004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 09:04:32 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "21004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 09:25:24 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "21005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 09:34:19 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "21006",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-15 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-15 09:44:19 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "22004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 09:52:22 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "23004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 06:31:26 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "23005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 06:45:58 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "23006",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 06:50:01 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "24004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 07:15:59 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "24005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 07:19:01 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "48013",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-16 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-16 07:28:59 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "25004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-17 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-17 09:02:50 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "25005",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-17 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-17 09:08:02 am"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "26004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-17 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-17 05:11:58 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "27004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-17 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-17 07:39:58 pm"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "value1": "28004",&nbsp; &nbsp; &nbsp; "alteredText": "2019-10-17 0...",&nbsp; &nbsp; &nbsp; "key": "2019-10-17 08:55:58 pm"&nbsp; &nbsp; }&nbsp; ].map(function(item) {&nbsp; &nbsp; return {&nbsp; &nbsp; &nbsp; "value1": item.value1,&nbsp; &nbsp; &nbsp; "alteredText": item.alteredText,&nbsp; &nbsp; &nbsp; "key": moment(item.key, "YYYY-MM-DD hh:mm a").toDate()&nbsp; &nbsp; }&nbsp; }),&nbsp; "prefixesOfBigNumbers": [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "number": "1000",&nbsp; &nbsp; &nbsp; "prefix": " K"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "number": "1000000",&nbsp; &nbsp; &nbsp; "prefix": " Mn"&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; "number": "1000000000",&nbsp; &nbsp; &nbsp; "prefix": " Bn"&nbsp; &nbsp; }&nbsp; ],&nbsp; "chartCursor": {&nbsp; &nbsp; "valueBalloonsEnabled": true,&nbsp; &nbsp; "oneBalloonOnly": true,&nbsp; &nbsp; "categoryBalloonEnabled": true,&nbsp; &nbsp; "cursorAlpha": 0&nbsp; },&nbsp; "addClassNames": true,&nbsp; "export": {&nbsp; &nbsp; "fileName": "Line Chart",&nbsp; &nbsp; "columnNames": {&nbsp; &nbsp; &nbsp; "key": "clf_polled_dttm"&nbsp; &nbsp; },&nbsp; &nbsp; "exportFields": [&nbsp; &nbsp; &nbsp; "key",&nbsp; &nbsp; &nbsp; "value1"&nbsp; &nbsp; ],&nbsp; &nbsp; "enabled": true&nbsp; },&nbsp; "marginTop": 50});#chartdiv {&nbsp; width: 100%;&nbsp; height: 500px;}<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script><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" /><div id="chartdiv"></div>
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript