New to Kendo UI for jQuery? Start a free 30-day trial
Use Fixed Bar Sizes in Charts
Updated on Sep 11, 2026
Environment
| Product | Progress® Kendo UI® Chart for jQuery |
| Operating System | Windows 10 64bit |
| Visual Studio Version | Visual Studio 2017 |
| Preferred Language | JavaScript |
Description
How can I set the size of the default drawing element of the Chart bars to the same size?
Solution
The following example demonstrates how to use the series.visual function to scale the default drawing element of the bars and achieve this behavior.
<div id="chart"></div>
<script>
var BAR_SIZE = 10;
$("#chart").kendoChart({
series: [{
type: "bar",
data: [1, 2],
visual: function(e) {
//create the default visual
var visual = e.createVisual();
//scale it so that it has the predefined size
visual.transform(kendo.geometry.transform().scale(1, BAR_SIZE / e.rect.size.height, e.rect.center() ));
return visual;
}
}]
});
</script>
</div>