多色线

Question

在数据中，有一个名为clr的对象属性，它实际上包含了对应对象的颜色信息。我想用多种颜色绘制一条线。但是到目前为止，我无法让它工作。

这是我的数据集的一个小样本。

{x: 11,y: 599,k: 500,clr:'blue'}, { x: 6,y: 699,k: 800,clr:'yellow'}

这是我预期可以运行的代码示例：

series: [{data: mydata,color: mydata.clr}],

http://jsfiddle.net/epvg86qu/19/

Answer 1

将您的函数更改为如下所示，您必须告诉 Kendo 使用 colorField：

function createChart() {
    $("#chart")
    .kendoChart({
        xAxis: {},
        yAxis: {},
        seriesDefaults: {type: "scatterLine" },
        series: [{data: stats2,colorField: "clr"}],
  })
}

已更新 fiddle：http://jsfiddle.net/epvg86qu/20/

Answer 2

如前所述 here，当 series.type 设置为 "bar"、"column"、"bubble"、"donut" 时支持 colorField 选项, "pie", "candlestick", "ohlc" 或 "waterfall".

唯一的方法似乎是创建多个系列。参见 fiddle：http://jsfiddle.net/53ygp9ut/2/

function createChart() {
    $("#chart").kendoChart({
        xAxis: {},
        yAxis: {},
        seriesDefaults: {type: "scatterLine" },
        series: [{data: stats1, color: "blue"},
                 {data: stats2, color: "yellow"},
                 {data: stats3, color: "red"}],
    });
}

$(document).ready(createChart);

多色线

Multi-Color Line

javascript

jquery

telerik

kendo-ui

kendo-chart