Morris.js xKey添加无意义的值

Question

我一直在努力解决这个问题一个小时，我无法弄清楚为什么莫里斯图表将某种时间值放入X轴。

首先，我的JSON如下：

<asp:GridView ID="SupportScheduleTable" AutoGenerateColumns="False" Width="100%" runat="server" OnRowCommand="SupportSchedule_RowCommand">
  <Columns>
    <asp:TemplateField HeaderText="Shift Manager">
      <EditItemTemplate>
        <asp:DropDownList ID="ddlshiftmanager" runat="server" Width="99%"></asp:DropDownList>
      </EditItemTemplate>
      <ItemTemplate>
        <asp:Label ID="Label1" runat="server" Text='<%# Bind("shift_manager") %>'></asp:Label>
      </ItemTemplate>
      <HeaderStyle Width="32%" />
    </asp:TemplateField>
    <asp:TemplateField ItemStyle-HorizontalAlign="Center">
      <ItemTemplate>
        <asp:ImageButton ID="lbEdit" CssClass="btn" ImageUrl="~/Files/edit.png" CommandArgument='<%# Eval("support_schedule_id") %>' CommandName="EditRow" runat="server"></asp:ImageButton>
      </ItemTemplate>
      <EditItemTemplate>
        <asp:LinkButton ID="lbUpdate" CommandArgument='<%# Eval("support_schedule_id") %>' CommandName="UpdateRow" runat="server">Update</asp:LinkButton>
        <asp:LinkButton ID="lbCancel" CommandArgument='<%# Eval("support_schedule_id") %>' CommandName="CancelUpdate" runat="server" CausesValidation="false">Cancel</asp:LinkButton>
      </EditItemTemplate>
      <HeaderStyle Width="2%" />
    </asp:TemplateField>
    //two dropdownlists before image button
  </Columns>
</GridView>

我正在以这种方式创建图表：

{"data":[{"date":"2015-06-08","payed":"18.08","to_pay":"18.08"},
         {"date":"2015-06-11","payed":"70.24","to_pay":"108.24"}]}

现在问题是：为什么在上帝的天堂是X轴写出图像所显示的价值？

正如您在我的JSON中看到的那样，有两个不同的日期。如果我只有一个日期（无论哪一个）图表工作正常（它在X轴中输出日期值），例如：

var json = JSON.parse(response);

Morris.Line({
    element: 'recebimentos-chart',
    data: json.data,
    xkey: 'date',
    ykeys: ['to_pay', 'payed'],
    labels: ['To pay', 'Payed'],
    gridTextColor: '#000',
    lineColors: ['#EA8A67', '#22aa22'],
});

编辑1 ：尝试 JSFiddle 时，我发现问题是图表的宽度。宽度较小的图表正确显示日期，宽度较大，呈现小时（??）

问题在于我需要提供一张大图表。

Answer 1

试试这个： http://jsfiddle.net/z97z2Lam/1/

他们的doc说明xLabels属性：

Sets the x axis labelling interval. By default the interval will be automatically computed. The following are valid interval strings:
"decade"
"year"
"month"
"week"
"day"
"hour"
"30min"
"15min"
"10min"
"5min"
"minute"
"30sec"
"15sec"
"10sec"
"5sec"
"second"