Morris图表日期问题

我使用morris.js图表作为图表。Morris图表日期问题

现在我需要在一个图表显示日期和价格，所以我写：

Morris.Area({ 
    element: 'line-example', 
    data: [ 
     { 
      period: 2016-11-22 16:36:16, 
      price: 22   
     }, 
     { 
      period: 2016-11-06 16:36:16, 
      price: 61   
     }, 
     { 
      period: 2016-10-31 16:36:16, 
      price: 49 
     }, 
     { 
      period: 2016-11-08 11:16:53, 
      price: 131 
     }, 
     { 
      period: 2016-11-10 13:52:10, 
      price: 85   
     }, 
     { 
      period: 2016-11-14 12:16:15, 
      price: 72 
     }, 
     { 
      period: 2016-11-17 14:36:34, 
      price: 206  
     },     
    ], 
    lineColors: ['#a5d9c7'], 
    xkey: 'period', 
    ykeys: ['price'], 
    labels: ['Day'], 
    xLabels: 'day', 
    pointSize: 0, 
    lineWidth: 0, 
    fillOpacity: 1, 
    resize: true, 
    behaveLikeLine: true, 
    gridLineColor: '#e0e0e0', 
    hideHover: 'auto'  
});

http://jsbin.com/sedusigamo/1/edit?html,js,output

为什么我的代码将无法正常工作？这里可能有什么问题？我在阅读文档的日期可以像我的代码格式。

来源

2016-11-23 Aleks Per

文档说：

时间戳在millisecond timestamps接受的形式（由Date.getTime（返回）或以下格式的strings：

它说的那样strings或您的日期是strings，而不是timestamps，所以您需要为您的period数据添加报价"这样的数据：

data: [ 
{ 
    period: "2016-11-22 16:36:16", 
    price: 22 
}, 
{ 
    period: "2016-11-06 16:36:16", 
    price: 61 
}, 
{ 
    period: "2016-10-31 16:36:16", 
    price: 49 
}, 
{ 
    period: "2016-11-08 11:16:53", 
    price: 131 
}, 
     { 
    period: "2016-11-10 13:52:10", 
    price: 85 
}, 
{ 
    period: "2016-11-14 12:16:15", 
    price: 72 

}, 
{ 
    period: "2016-11-17 14:36:34", 
    price: 206 
}

http://jsbin.com/wabizokefi/1/edit?html,js,output

来源

2016-11-23 16:15:52 krlzlx

Morris图表日期问题

回答

相关问题