类别的剑道条形图颜色 [英] kendo bar chart colors of categories
问题描述
请看这里:http://jsbin.com/teveza/edit?html,output
基本上我试图有两个水平条进行比较.我希望他们有一个 categoryAxis 标题并有不同的颜色.我不能同时得到.
Basically I'm trying to have two horisontal bars for comparison. I want them to have a categoryAxis title and have different colors. And I cannot get both.
到目前为止,我能得到的最接近的是:
So far the closest I can get is this:
{
seriesColors: ["red", "green"],
"seriesDefaults": {
"type": "bar"
},
series: [
{ data: [2,3] },
],
categoryAxis:{
categories:["Red Category","Green Category"],
lables:{
visible:true, }
}
}
所以......任何关于如何做到这一点的指示将不胜感激
So.... any pointers on how to do that will be appreciated
推荐答案
系列对象有一个名为 colorField 的属性,可用于:http://docs.telerik.com/KENDO-UI/api/javascript/dataviz/ui/chart#configuration-series.colorField
The series object has a property called colorField that can be used for this: http://docs.telerik.com/KENDO-UI/api/javascript/dataviz/ui/chart#configuration-series.colorField
您可以通过以下两种方式之一使用它:
You can use it in one of the following 2 ways:
更新了JSBIN
Updated JSBIN
$("#chart1").kendoChart({
theme: "flat",
dataSource: {
data:[
{key: "Red Category", value: "2", usercolor: "red"},
{key: "Green Category", value: "3", usercolor: "green"},
]},
seriesDefaults: {
type: "bar",
},
series: [{
field: "value",
categoryField: "key",
colorField: "usercolor",
}],
});
$("#chart2").kendoChart({
theme: "flat",
seriesDefaults: {
type: "bar",
},
series: [{
field: "value",
colorField: "usercolor",
data: [
{value: "2", usercolor: "red"},
{value: "3", usercolor: "green"},
],
}],
categoryAxis:{
categories:["Red Category", "Green Category"],
}
});
这篇关于类别的剑道条形图颜色的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!