我正在为我的AIR App添加图表。方法如下:
private function CountersChart(container:VGroup):void {
var arr:Array = [];
var dt:Date = new Date();
var counters:Counters = Constants.srv.getCounters(dt.fullYear, dt.month);
var goals:ArrayCollection = Constants.srv.getGoals();
var index:int = 0;
var found:Boolean = false;
var now:Date = new Date();
while (!found) {
var goal:Goals = goals[index];
if (now.month+1==goal.month && now.fullYear==goal.year) {
found=true;
break;
} else
index++;
}
arr.push({label:"Calls", x:"Calls", y:counters.phone, y1:goals[index].calls});
arr.push({label:"Text", x:"Text", y:counters.sms, y1:goals[index].sms});
arr.push({label:"Email", x:"Email", y:counters.email, y1:goals[index].emails});
arr.push({label:"Marketing Tools", x:"Marketing Tools", y:counters.marketing, y1:goals[index].sendMarketingTools});
arr.push({label:"Meetings", x:"Meetings", y:counters.meeting, y1:goals[index].meetings});
arr.push({label:"Home Presentations Invites", x:"Home Presentations Invites", y:counters.homePresentationInvite, y1:goals[index].homePresentations});
arr.push({label:"Business Presentation Invites", x:"Business Presentation Invites", y:counters.businessPresentationInvite, y1:goals[index].businessPresentations});
// Create a column chart object
var stackedColumnChart:ColumnChart = new ColumnChart();
stackedColumnChart.dataProvider = arr;
stackedColumnChart.showDataTips = true;
stackedColumnChart.dataTipFunction = myDataTipFunction;
stackedColumnChart.percentWidth = 100;
// Set the horizontal axix category
var xAxis:CategoryAxis = new CategoryAxis();
xAxis.categoryField = "x";
stackedColumnChart.horizontalAxis = xAxis;
// ColumnSet.series is an array which contains
// an array of ColumnSeries objects.
var columnSet:ColumnSet = new ColumnSet();
columnSet.type = "stacked";
// Each item in seriesDetails becomes a different segment of
// a column in the stacked chart i.e. each item represents a series.
var seriesDetails:ArrayCollection = new ArrayCollection([
{YField:"y", DisplayName:"Actual"},
{YField:"y1", DisplayName:"Planned"},
]);
// Create a ColumnSeries, and an array to be
// populated with dynamically generated columnSeries objects
var columnSeries:ColumnSeries;
var seriesArray:Array = new Array();
var xr:AxisRenderer = new AxisRenderer();
xr.setStyle("fontSize",40);
//columnSeries.verticalAxis = xr;
// Generate an array of ColumnSeries objects
// which are then be applied to the ColumnSet series.
for(var i:int = 0; i < seriesDetails.length; i++){
columnSeries = new ColumnSeries();
columnSeries.yField = seriesDetails[i].YField;
columnSeries.displayName = seriesDetails[i].DisplayName;
columnSeries.setStyle("fill",fillsArray[i]);
seriesArray.push(columnSeries);
}
columnSet.series = seriesArray;
// c.series could take an array of column sets
// for displaying mixed charts i.e. c.series = [columnSet1, columnSet2];
stackedColumnChart.series = [columnSet];
//stackedColumnChart.showAllDataTips();
stackedColumnChart.showDataTips = true;
stackedColumnChart.id = "chart";
var legend:Legend = new Legend();
legend.direction = "horizontal";
legend.setStyle("fontSize",30);
legend.dataProvider = stackedColumnChart;
stackedColumnChart.setStyle("horizontalAxisRenderers", xr);
stackedColumnChart.addEventListener(MouseEvent.CLICK,function(event){return});
//Add chart to the display list.
container.addElement(stackedColumnChart);
container.addElement(legend);
}
结果很好地绘制了图表但是:图例的字体大小和x / y轴都很小,甚至无法读取它们。
我尝试设置legend.setStyle(“fontSize”,fs)或设置图例minHeight(如此处所示:Flex chart labels way too small, how to resize axis?
但无济于事: - (
如何修改它们的字体大小?
由于
答案 0 :(得分:1)
你需要为LegendItem类和ColumnChart类提供css,然后它将为它选择样式:
<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";
mx|LegendItem
{
fontSize:20;
}
mx|ColumnChart
{
fontSize:15;
}
</fx:Style>
向Legend提供setStyle不起作用。
如果它适合您,请告诉我。