Multicolor line

Question

The data has a property of the clr object, which actually contains information about the color of the corresponding object. I would like to draw a single line with several colors. However, so far I have not been able to get it to work.

Here is a small sample of my dataset.

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

Here is a sample code that I expected to work:

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

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

Answer 1

As mentioned here , the colorField option is supported when the series.type parameter is set to bar, column, bubble, donut, pie, candlestick, ohlc, or waterfall.

The only way to do this is to create several episodes. See the script: 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); 

Answer 2

Change your function to look like this, you have to tell Kendo to use colorField:

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

Updated script: http://jsfiddle.net/epvg86qu/20/