Remove "borders" from bar chart

2 posts, 0 answers
  1. Olga
    Olga avatar
    13 posts
    Member since:
    May 2013

    Posted 26 Jun 2013 Link to this post

    Hello!
    Could you, please, help find property that will "turn off" bar chart "borders" -- see attach.
    I need to display just 2 bars without axis or these "boreders" -- just 2 bars.

    Thanks!

    Here is chart declaration:

     $("#chart20").kendoChart({
                    chartArea: {
                        height: 300,
                        width: 400,
                        margin: 0
                    },
                    dataSource: dataSourceMetrics,            
                    legend: {
                        visible: false
                    },
                    seriesDefaults: {
                        type: "bar"
                    },
                    series: [{                 
                        field: "F1"
                    },
                    {                  
                        field: "F2"
                    }],
                    valueAxis: [{                            
                        labels: {
                            visible: false
                        },
                        line: {
                            visible: false
                        },
                        minorGridLines: {
                            visible: false
                        },
                        majorGridLines: {
                            visible: false
                        }
                    }],
                    yAxis: {
                        labels: {
                            visible: false
                        },
                        line: {
                            visible: false
                        }
                    },              
                    tooltip: {
                        visible: true,
                        template: "#= series.name #: #= value #"
                    }
                });


    KendoUI ver: 2013.1.319
    Browsers: FireFox 20.0.
  2. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 27 Jun 2013 Link to this post

    Hello Olga,

    In order to achieve this you should set visible: false to the categoryAxis.majorGridLines. I.e.: 

    $("#chart20").kendoChart({
      //....
      categoryAxis: {
          majorGridLines: {
             visible: false
          }
      }
    });
    Regards,
    Iliana Nikolova
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top