1

我试图在 KendoUI 的单个折线图上显示两个系列。

系列中的日期不匹配（即系列二在系列一之后开始，并且在系列一之前结束）。然而，KendoUI 从图表的开头开始呈现这两个系列。

我创建了一个简单的 jsfiddle 来演示这个问题，总结如下：

HTML：

<div id="chart" />

CSS：

#chart
{
    width: 400px;
    height: 280px;
}

JS：

$(function () {
    var dataSource = new kendo.data.DataSource({
        data: [
            { series: 'Series 1', date: new Date(2013, 04, 01), count: 1 },
            { series: 'Series 1', date: new Date(2013, 04, 02), count: 3 },
            { series: 'Series 1', date: new Date(2013, 04, 03), count: 5 },
            { series: 'Series 1', date: new Date(2013, 04, 04), count: 3 },
            { series: 'Series 1', date: new Date(2013, 04, 05), count: 1 },
            { series: 'Series 2', date: new Date(2013, 04, 02), count: 5 },
            { series: 'Series 2', date: new Date(2013, 04, 03), count: 3 },
            { series: 'Series 2', date: new Date(2013, 04, 04), count: 5 }
        ],

        group: {
            field: 'series'
        },

        sort: {
            field: 'date',
            dir: 'asc'
        },

        schema: {
            model: {
                fields: {
                    date: {
                        type: 'date'
                    }
                }
            }
        }
    });

    dataSource.read();

    $('#chart').kendoChart({
        title: {
            text: 'Date Demonstration'
        },

        dataSource: dataSource,

        seriesDefaults: {
            type: 'line'
        },

        series: [{
            field: 'count',
            data: []
        }],

        valueAxis: {
            line: {
                visible: false
            },

            labels: {
                step: 2,
                template: function (value) {
                    return value.value % 1 === 0 ? value.value : ' ';
                }
            }
        },

        categoryAxis: {
            field: 'date',

            type: 'date',

            labels: {
                template: function (value) {
                    return value.value.getDate();
                }
            }
        },

        legend: {
            position: 'bottom'
        }
    });
});

该图应该有从“2”开始的第二个系列，而不是从“1”开始。

任何人都知道如何解决这个问题？这是 KendoUI 中的错误吗？

4

1 回答 1

2

更新：Kendo 回应了我们随后打开的支持请求：

折线图就是这样工作的。您有一些类别，然后为每个类别指定一个值。在您的情况下，我建议您使用散点线图，或者您需要使用 null 作为值填充第二个系列中的缺失值。

因此，我认为这是一个不会修复的错误，因为在这种情况下，我告诉图表类别轴是日期；然后给它从数据源中获取这些日期的字段。该图表应该能够将这些值绘制到正确日期类别的图表中。

于 2013-05-10T02:58:35.900 回答