Set Header Items Color
The following example demonstrates how to set the Kendo UI TreeMap tiles color from the items.
<div id="treemap">
</div>
<script>
$("#treemap").kendoTreeMap({
dataSource: {
data: [{
name: "Root",
color: "red",
items: [{
name: "Group A",
value: 1,
color: "green",
items: [{ name: "foo", value: 1, color: "blue" }, { name: "bar", value: 2, color: "orange"}]
}]
}]
},
valueField: "value",
textField: "name",
colorField: "color",
dataBound: function (e) {
if (e.node) {
var element = this.findByUid(e.node.uid);
element.css("background-color", e.node.color);
}
}
});
</script>