jquery - Align the left of Kendo UI bar charts -


enter image description here

i have bar chart above. creating 3 charts json file.

i need align left of charts in same line

 function showresults() {                     $.ajax({                         type: "get",                         url: "/ajax/xyz.aspx?requesttype=xxxx&y=2",                         async: false,                         success: function (data) {                             if (json.parse(data).length > 0) {                                 var chartdata = json.parse(data);                                 createeatingchart(chartdata);                                 createexercisechart(chartdata);                                 createcopingchart(chartdata);                             }                         }                     });                 }                  function createeatingchart(_chartdata) {                     var result = $.grep(_chartdata, function (e) { return e.pattern_type == 'eating'; });                     var lowresult = $.grep(result, function (e) { return e.score <= 50; });                     var highresult = $.grep(result, function (e) { return e.score > 50; });                       $("#diveating").kendochart({                         seriescolors: ["green", "red"],                          chartarea: {                             background: ""                         },                          title: {                             text: "eating",                             font: "18px arial,helvetica,sans-serif bold",                             color: 'black'                         },                          legend: {                             visible: false,                         },                          chartarea: {                             background: ""                         },                          seriesdefaults: {                             type: "bar",                             stack: true,                             overlay: {                                 gradient: "none"                             }                         },                         series: [{                             name: 'lowresult',                             data: lowresult,                             field: "score",                             categoryfield: "patternname"                         },                         {                             name: 'highresult',                             data: highresult,                             field: "score",                             categoryfield: "patternname"                         }],                          valueaxis: {                             majorgridlines: {                                 visible: true                             },                              labels: {                                 visible: false,                                                                 }                         },                          tooltip: {                             visible: true                          }                     });                  } 

is possible pad labels on the left side empty string have same width

it hard css, since created svg. trick can find out add &nbsp; each chart has same category length.

http://jsfiddle.net/bochzchan/h4wy9/

categoryaxis: {              categories: ["&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;jan", "feb", "mar", "apr", "may", "jun"],             majorgridlines: {             visible: false              } }, 

Comments

Popular posts from this blog

plot - Remove Objects from Legend When You Have Also Used Fit, Matlab -

java - Why does my date parsing return a weird date? -

Need help in packaging app using TideSDK on Windows -