This is a migrated thread and some comments may be shown as answers.

How to change the series icon shape in Kendo UI linechart?Can I use custom icon?

1 Answer 169 Views
Charts
This is a migrated thread and some comments may be shown as answers.
xixi
Top achievements
Rank 1
xixi asked on 28 Apr 2014, 01:46 PM
I know the default icon is "circle",now I want to change the icon shape.The total icon shape are only "circle", "square", "triangle", "cross".Can Iuse custome icon?I use these codes in the databound event,but it seems not work.

var colorArr = new Array("#FF0000", "#FF8C00", "#006400", "#40E0D0", "#800080");
var iconShapeArr = newArray("circle", "square", "triangle", "cross");
function onDataBound(e) {
 var chart = e.sender;
 var series = chart.options.series;
 for(var index = 0; index <= series.length - 1; index++) {
     chart.options.series[index].color = colorArr[index];
     chart.options.series[index].markers.background = colorArr[index];
    // chart.options.series[index].notes.icon.shape = "square";
 }

1 Answer, 1 is accepted

Sort by
0
Iliana Dyankova
Telerik team
answered on 29 Apr 2014, 03:23 PM
Hi,

Using custom icons for markers is currently not supported by Kendo UI Chart and you should use the built-in types. For example: 
function onDataBound(e) {
    var colorArr = ["#FF0000", "#FF8C00", "#006400", "#40E0D0", "#800080"];
    var iconShapeArr = ["triangle", "square", "triangle", "cross"];
    var chart = e.sender;
    var series = chart.options.series;
    for(var index = 0; index <= series.length - 1; index++) {
       chart.options.series[index].color = colorArr[index];
       chart.options.series[index].markers.background = colorArr[index];
       chart.options.series[index].markers.type = iconShapeArr[index];
    }
}


Regards,
Iliana Nikolova
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Charts
Asked by
xixi
Top achievements
Rank 1
Answers by
Iliana Dyankova
Telerik team
Share this question
or