Monday, May 20, 2024
 Popular · Latest · Hot · Upcoming
168
rated 0 times [  169] [ 1]  / answers: 1 / hits: 18211  / 12 Years ago, fri, april 13, 2012, 12:00:00

I'm am replacing my dot net charting with KendoUI. I'm showing a Score Distribution chart. I want all of the bars to be the same color except the bar with the median score and the Legend. How do I color a single bar a unique color? How would I color the Legend this new color?



Below is my old dotnet charting bar chart and below that is the new KendoUI chart I'm trying to replace it with. I just need to get that coloring right and we'll be in business. Any help is appreciated.



enter


More From » jquery

 Answers
20

Update: I'm leaving the answer below this line intact in case there are those out there who are using an older version, but per a later comment, KendoUI now allows you to override styles for individual points in a series.






I don't believe you can, in the current version. That said, you can hack your way around the limitation.



You'll need to create two data series - one for your highlighted data, and one for everything else. Add both to you chart, and set them to stacked.



Here's a jsFiddle I put together to illustrate: http://jsfiddle.net/LyndsySimon/9VZdS/. It depends on KendoUI's CDN, so if it breaks in the future I apologize.



Here is the Javascript for reference:



$(function() {
var dataset = new Array(1,2,3,null,5,6);
var highlighted = new Array(null,null,null,4,null,null);

$('#chart').kendoChart({
theme: 'metro',
seriesDefaults: {
type: 'column',
stack: true
},
series: [
{
name: 'Not Highlighted',
data: dataset,
color: '#609'
},
{
name: 'Highlighted',
data: highlighted,
color: '#f03'
}
]
})
});​

[#86253] Thursday, April 12, 2012, 12 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
luna

Total Points: 698
Total Questions: 114
Total Answers: 93

Location: Israel
Member since Wed, Apr 14, 2021
3 Years ago
luna questions
;