对齐Kendo UI条形图的左侧

enter image description here 对齐Kendo UI条形图的左侧

我有上面的条形图。我从json文件创建三个图表。

我需要对齐所有图表的左边，这样所有在同一行

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 

         } 
        }); 

       }

是否可以垫在左侧的标签，用一个空字符串，使它们都具有相同的宽度

来源

2014-06-24 sony

很难从CSS做到这一点，因为它是从SVG创建的。我可以找到的唯一技巧是添加 ，因此每个图表具有相同的类别长度。

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 
      } 
},

来源

2014-06-26 00:40:27

对齐Kendo UI条形图的左侧

回答

相关问题