的 DEMO

Question

我试图创建一个折线图并在其上添加一个额外的泡点。图表使用DataSource而不是标准系列。

所以我的折线图的结构如下：

http://dojo.telerik.com/@dmathisen/EZOTI

现在我正在尝试添加一个泡泡。像这样的东西，但它不起作用。我不确定如何让他们一起玩得很好。

http://dojo.telerik.com/@dmathisen/IgEWA

理想情况下，线条和气泡会在同一轴上，但如果它不可能那么好。

Answer 1

折线图使用categoryAxis和值Axis，而气泡图使用xAxis和yAxis。因此，不要使用line，而是使用系列的散点图类型。

给出这样的数据：

{
    "date": "12/30/2011",
    "close": 405,
    "volume": 6414369,
    "open": 403.51,
    "high": 406.28,
    "low": 403.49,
    "symbol": "2. AAPL"
},

像这样创建你的图表：

$("#chart").kendoChart({
    dataSource: {   
        data: data,
        sort: {
            field: "date",
            dir: "asc"
        },
        schema: {
            model: {
                fields: {
                    date: {
                        type: "date"
                    }
                }
            }
        }
    },
    seriesDefaults: {
        type: "scatterLine",
        markers: {size: 6}
    },
    series: [
        // lines
        { xField: "date", yField: "close" },
        { xField: "date", yField: "open" },
        { xField: "date", yField: "high" },
        // bubble
        { type: "bubble",  xField: "date", yField: "close", sizeField: "volume"}
    ],
    xAxis: [{}],
    yAxis: [{}]
});

带有额外气泡轴的Kendo折线图

1 个答案:

的 DEMO