'회전'이 사용되는 경우 축의 제목이 영향을 미칩니다 - Dojo-Charts
-
14-11-2019 - |
문제
X 축의 Lables가 회전 할 수 있도록 '회전 : -90'을주었습니다. 그러나 그 회전은 축의 제목에도 적용됩니다. 어떻게 그만 멈출 수 있습니까?누구든지 도와주세요. 아래는 내가 사용하는 코드입니다 ..
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
I got the solution for this issue... here is the code
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));
}
it can be called as
mychart.render();
setAxisTitle(mychart,"x","Title for X axis",10);
setAxisTitle(mychart,"y","Title for Y axis",10);
-- SuryaPavan
다른 팁
I have just encountered a similar problem as you and stumbled across a slightly easier solution to the one you proposed above.
From http://dojotoolkit.org/reference-guide/dojox/charting.html#axis-title:
titleOrientation determines the title orientation to the axis, facing to the axis by “axis”, or facing away from the axis by “away”.
I found that by adding titleOrientation: "away"
to the x axis parameters this will override the existing rotation
parameter and thus solves the problem.
FYI: Similar question
제휴하지 않습니다 StackOverflow