Only part of chart shown when using panes and stacked bars

The code below displays two bars in a stacked bar chart using a pane. My problem is that only part of the chart is shown, you can see that the x-axis starts at 94%. So it looks like the value 50(bar 1) is smaller than 2(bar 2). Why is only part of the chart shown and how can I fix this?

<div id="chart"></div>
<script>
$("#chart").kendoChart({
                legend: {
                    visible: false
                },
                seriesDefaults: {
                    type: "bar",
                    stack: {
                        type: "100%"
                    },
                    labels: {                     
                        visible : true,
                    position: "insideBase"
                    }                   
                },
                panes:[{ 
                    name: "pane1"
                }],             
                series: [{                                                                
                   data: [50],
                   axis: "axis1",
                   categoryAxis: "catAxis1"                    
                }, 
                {                                       
                    data: [2],
                    axis: "axis1",
                    categoryAxis: "catAxis1"
                }],
                valueAxis: [{
                    name: "axis1", 
                    pane: "pane1"
                }],
                categoryAxis: [{ 
                    name: "catAxis1", 
                    pane: "pane1"
                }]     
});
</script>

Answers


Just add a min value of 0 to the valueAxis:

valueAxis: [{
    min: 0,
    name: "axis1", 
    pane: "pane1"
}],

DEMO


Need Your Help

iOS change tab programmatically

iphone ios ios4

I'm developing an iOS application with a tab bar and navigation. When I press a button in the first tab I want it to load the second tab with a navigation controller and push the next view. Can som...

Dependency injection in Angular Directive

angularjs controller angularjs-directive annotations dependencies

Why is injecting a Controller in a directive done through require but other dependencies through the array annotation?

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.