2011-05-18 22 views
3

我已经给出'旋转:-90'来使x轴的标签旋转。 但是,该旋转甚至适用于该轴的标题。 我该如何阻止?请任何人帮助我。 下面是我使用的代码..当使用“旋转”时,轴的标题正在影响 - dojo-charts

  makeCharts = function() { 
      var chart1 = new dojox.charting.Chart2D("simplechart", { 
         title: "Production(Quantity)", 
         titlePos: "top", 
         titleGap: 5, 
          titleFont: "normal normal normal 15pt Arial", 
         titleFontColor: "orange" 
      }); 

      chart1.addPlot("default",{type:"ClusteredColumns", 
              gap: 5, 
              animate:{duration: 500} }) 
      chart1.addSeries("2008", [113.1,72.1,62.6,59.8,59.3,53.7,52.4,49.1,43.7,40.9], {fill: "#DDFEDC"}); 
      chart1.addSeries("2007",[113.6,65.0,59.2,56.4,62.8,53.5,47.6,44.9,41.5,39.1], {fill: "#FCDEFD"}); 
      chart1.addAxis("x", { 
      title:'x-axis title comes here', 
      includeZero: false, 
      labels:[ 
       {value:1, text:'one'}, 
           {value:2, text:'two'}, 
           {value:3, text:'three'}, 
           {value:4, text:'four'}, 
           {value:5, text:'five'}, 
           {value:6, text:'six'}, 
           {value:7, text:'seven'}, 
           {value:8, text:'eight'}, 
           {value:9, text:'nine'}, 
           {value:10, text:'ten'}              
          ], 
      rotation:-90 
     } 
      ); 
      chart1.addAxis("y", { 
      vertical: true, 
      includeZero: true, 
      from:0, 
      to:200, 
      minorTickStep:20} 
     ); 
    var anim4b = new dojox.charting.action2d.Tooltip(chart1, 'default'); 
      chart1.render(); 

    new dojox.charting.widget.Legend({chart:chart1, horizontal: true}, "legend"); 
     }; 
    dojo.addOnLoad(makeCharts); 

回答

2

我得到了这个问题的解决方案... 这里是代码

var setAxisTitle=function(chart, axisname, title, fontsizept) { 
    var axis = chart.axes[axisname]; 
    var dim = chart.dim; 
    var offsets=chart.offsets; 
    var ta = chart.theme.axis; 
    var taFont = "font" in axis.opt ? axis.opt.font : ta.font; 
    var x; 
    var y; 
    var label; 
    var rotate=0; 
    if(axis.vertical) { 
     rotate=270 
     label = title; 
     y=dim.height/2 - offsets.b/2; 
     x=0+2*fontsizept; 
    } else { 
     label = title; 
     x=dim.width/2 + offsets.l/2; 
     y=dim.height-fontsizept/2; 
    } 
    var m = dojox.gfx.matrix; 
    var elem = axis.group.createText({x:x, y:y, text:label, align: "middle"}); 
    elem.setFont({family:taFont.family, size: fontsizept+"pt", weight: "bold"}); 
    elem.setFill('grey'); 
    elem.setTransform(m.rotategAt(rotate, x,y)); 
} 

它可以被称为

mychart.render(); 
setAxisTitle(mychart,"x","Title for X axis",10); 
setAxisTitle(mychart,"y","Title for Y axis",10); 

- SuryaPavan

3

我刚刚遇到一个和你类似的问题,并偶然发现了一个稍微简单的解决方案,以你上面提出的解决方案。

http://dojotoolkit.org/reference-guide/dojox/charting.html#axis-title

titleOrientation确定标题取向于轴线,通过 “轴线”面向轴,或者通过“离开”背离轴线的方向。

我发现,通过添加titleOrientation: "away"于x轴的参数,这将覆盖现有rotation参数,从而解决了问题。

供参考:Similar question