【问题标题】:morris.js issue with hours on x-axismorris.js 在 x 轴上的小时数问题
【发布时间】:2014-04-16 18:08:42
【问题描述】:

我正在尝试创建类似于谷歌分析受众概览图的东西。我试图把从午夜 12:00 到晚上 11:00 的时间放在 x 轴上

这是我目前使用的:

Morris.Line({

    element: 'chart_div_compare',

    data: [            
        { hours: '00:00', a: 793, b: 729},
        { hours: '01:00', a: 524, b: 537},
        { hours: '02:00', a: 337, b: 347},
        { hours: '03:00', a: 272, b: 213},
        { hours: '04:00', a: 176, b: 169},
        { hours: '05:00', a: 174, b: 147},
        { hours: '06:00', a: 212, b: 193},
        { hours: '07:00', a: 341, b: 294},
        { hours: '08:00', a: 551, b: 501},
        { hours: '09:00', a: 724, b: 692},
        { hours: '10:00', a: 880, b: 896},
        { hours: '11:00', a: 955, b: 1004},
        { hours: '12:00', a: 1053, b: 1142},
        { hours: '13:00', a: 1063, b: 1150},
        { hours: '14:00', a: 92, b: 1123},
        { hours: '15:00', a: 0, b: 1151},
        { hours: '16:00', a: 0, b: 1222},
        { hours: '17:00', a: 0, b: 1155},
        { hours: '18:00', a: 0, b: 1246},
        { hours: '19:00', a: 0, b: 1100},
        { hours: '20:00', a: 0, b: 1199},
        { hours: '21:00', a: 0, b: 1395},
        { hours: '22:00', a: 0, b: 1361},
        { hours: '23:00', a: 0, b: 1005},
    ],
    // The name of the data record attribute that contains x-values.
    xkey: 'hours',
    hideHover: 'auto',
    // A list of names of data record attributes that contain y-values.
    ykeys: ['a', 'b'],
    // Labels for the ykeys -- will be displayed when you hover over the
    // chart.
    labels: ['2014-04-16', '2014-04-14']
});

x 轴变为 1900、1910、1920。 小时列的格式是否错误? 我不知道如何让它正确绘制,但最终我想 凌晨 12:00、凌晨 1:00 等

【问题讨论】:

  • 任何人都知道如何做到这一点。应该很容易
  • 将“parseTime”设置为 false 以跳过对 X 值的时间/日期解析,而是将它们视为等间距系列。

标签: datetime morris.js


【解决方案1】:

我刚遇到同样的问题,也许你可以使用以下选项:

parseTime: false

或者您可以自定义 xlabel 的格式方法。更多信息,您可以查看this websitemorris on github

【讨论】:

  • 很好的解决方案。谢谢。
  • 对于条形图,“parseTime: false”不起作用。您知道在条形图上以适当的单位显示时间需要做什么吗?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-05-17
  • 1970-01-01
  • 1970-01-01
  • 2014-08-11
  • 1970-01-01
  • 2020-01-11
相关资源
最近更新 更多