Setting Axis Crossing Values in Kendo charts using KendoTaglib

4 posts, 0 answers
  1. Aniroodh
    Aniroodh avatar
    2 posts
    Member since:
    Mar 2013

    Posted 25 Mar 2013 Link to this post

    Hey

    I am using Kendo Taglibs and i am unable to set the axis crossing values in kendo charts the way i used to do it in html without the taglibs. 
    For example, earlier i used to use 
     $("#chart").kendoChart({
    valueAxis: {
                            min: -10,
                            max: 10,
                            // Keeps the default axis at the 0 crossing point
                            // and moves the "label" axis to the very bottom
                            axisCrossingValues: [0, -10]
                         },
    })

    (http://jsbin.com/ahavog/107/edit)

    But i am not able to use this with the taglib:- 
     <kendo:chart-valueAxis>
    <kendo:chart-valueAxisItem  axisCrossingValue="-10000" >
    </kendo:chart-valueAxisItem>

    I am not able to set the other value resulting in the label and the default axis at the same level. Please help. 
  2. Hristo Germanov
    Admin
    Hristo Germanov avatar
    703 posts

    Posted 26 Mar 2013 Link to this post

    Hi Aniroodh,

    You can set axisCrossingValues in JSP with:

    axisCrossingValue="<%= new int[] { 0, 0, 10, 10 } %>"
    and you can examine this online demo for more information.

    Regards,
    Hristo Germanov
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Aniroodh
    Aniroodh avatar
    2 posts
    Member since:
    Mar 2013

    Posted 27 Mar 2013 Link to this post

    Hi Hristo, 

    Thanks for the reply..but its still not working..when i am using the kendo taglibs, it doesn't seem to affect the output using the expression that you'd suggested. Basically i need the label at say 10 units to the left of the horizontal bar graph..its working perfectly in the html kendo part by setting axis crossing values

    valueAxis: {
      // Keeps the default axis at the 0 crossing point
                            // and moves the "label" axis to the very bottom
                            axisCrossingValues: [0, -10]
    },
    but the taglib part doesnt seem to support the provision of 2 values..





  4. Hristo Germanov
    Admin
    Hristo Germanov avatar
    703 posts

    Posted 27 Mar 2013 Link to this post

    Hi Aniroodh,

    I don't know where can be the mistake, but here is the jsp example:

    <%@taglib prefix="kendo" uri="http://www.kendoui.com/jsp/tags"%>
    <%@taglib prefix="demo" tagdir="/WEB-INF/tags"%>
    <demo:header />
        <%
            String[] categories = {"A", "B", "C"};
        %>
         <div class="chart-wrapper">
             <kendo:chart name="chart">
                 <kendo:chart-series>
                    <kendo:chart-seriesItem type="bar" data="<%= new int[] { 1, 2, 3 } %>" />
                    <kendo:chart-seriesItem type="bar" data="<%= new int[] { 0, 0, 0 } %>" />
                 </kendo:chart-series>
                 <kendo:chart-categoryAxis>
                    <kendo:chart-categoryAxisItem axisCrossingValue="<%= new int[] { 0, -10 } %>" />
                    <kendo:chart-categoryAxisItem categories="<%= categories %>">
                        <kendo:chart-categoryAxisItem-line visible="false" />
                    </kendo:chart-categoryAxisItem>
                 </kendo:chart-categoryAxis>
                 <kendo:chart-valueAxis>
                    <kendo:chart-valueAxisItem min="-10" max="10" axisCrossingValue="<%= new int[] { 0, -10 } %>" />
                 </kendo:chart-valueAxis>
             </kendo:chart>
         </div>
    <demo:footer />
    And here is the result of this sample: http://screencast.com/t/exKxEe68sbRY

    Greetings,
    Hristo Germanov
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top