actionscript-3 - Flex：rotateLabels と canDropLabels を使用した小さな軸ラベル

Question

CategoryAxis に、rotateLabels canDropLabels で AxisRenderer を使用していますが、ラベルが微視的に見えます。他のすべてのラベルを問題なく表示できますが、ラベルは拡大しません。以下に完全な例を示します。Ubuntu フォントが必要な場合は、ここからダウンロードするか、独自のものを使用できます。CategoryAxis は 3 つのラベルごとに表示する必要があります。

<?xml version="1.0"?>
<!-- Derrived From: http://livedocs.adobe.com/flex/3/html/help.html?content=charts_types_06.html -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                initialize="init(event)" width="90%" height="60%">
  <mx:Style>
    @namespace mx "http://www.adobe.com/2006/mxml";
    @font-face{
      src: url("../assets/Ubuntu.ttf");
      fontFamily:Ubuntu;
      embedAsCFF:false;
      advancedAntiAliasing:true;
    }
    mx|ColumnChart {
      fontFamily:Ubuntu;
    }
  </mx:Style>
  <mx:Script>
    <![CDATA[
      import mx.collections.ArrayCollection;
      import mx.events.FlexEvent;
      import mx.formatters.DateFormatter;

      public static const msPerSecond:uint = 1000;
      public static const msPerMinute:uint = msPerSecond * 60;
      public static const msPerHour:uint = msPerMinute * 60;
      public static const msPerDay:uint = msPerHour * 24;
      public static const msPerWeek:uint = msPerDay * 7;

      protected var formatter:DateFormatter;

      private var currIndex:uint = 0;

      [Bindable]
      public var expenses:ArrayCollection;

      protected function init(event:FlexEvent):void {
        formatter = new DateFormatter();
        formatter.formatString = 'MM/DD';
        generateExpenses();
      }

      private function generateExpenses():void {
        var now:Date = new Date(), d:Date;
        expenses = new ArrayCollection();
        // The next 60 days inclusive
        for (var i:uint = 0; i < 60; i++) {
          d = new Date();
          d.time = now.time+i*msPerDay;
          var r:uint = rand(100, 1000);
          var o:uint = rand(1, 100);
          expenses.addItem({
            'date':d,
            'profit':r,
            'expenses':rand(r-o, r+o)
          });
        }
      }

      public function categoryLabel(val:Object, prev:Object,
          axis:CategoryAxis, item:Object):String {
        var index:uint = currIndex;
        currIndex++;
        return showLabel(index, axis.dataProvider.length, 20) ?
          formatter.format(val) : '';
      }

      private function rand(lb:int, ub:int):Number {
        return Math.floor(Math.random() * (1 + ub - lb)) + lb;
      }

      private function showLabel(index:uint, max:uint, interval:uint):Boolean {
        return index % int(Math.ceil(max/interval)) == 0;
      }
    ]]>
  </mx:Script>

  <!-- Define custom colors for use as column fills. -->
  <mx:SolidColor id="sc1" color="0x00FF00" alpha=".3"/>
  <mx:SolidColor id="sc2" color="0xFF0000" alpha=".3"/>

  <!-- Define custom Strokes for the columns. -->
  <mx:SolidColorStroke id="s1" color="0x00FF00" weight="2"/>
  <mx:SolidColorStroke id="s2" color="0xFF0000" weight="2"/>

  <mx:Panel title="ColumnChart Control with Custom Column Styles"
    width="100%" height="100%">
    <mx:HBox width="100%" height="100%">
      <mx:Legend dataProvider="{myChart}"/>
      <mx:ColumnChart id="myChart" dataProvider="{expenses}" showDataTips="true"
          width="100%" height="100%" gutterBottom="50">
        <mx:horizontalAxis>
          <mx:CategoryAxis id="cAxis" dataProvider="{expenses}"
              categoryField="date" labelFunction="categoryLabel"/>
        </mx:horizontalAxis>
        <mx:horizontalAxisRenderers>
          <mx:AxisRenderer axis="{cAxis}" labelRotation="{-25}"
            canStagger="false" canDropLabels="true" fontSize="20"/>
        </mx:horizontalAxisRenderers>
        <mx:series>
          <mx:ColumnSeries 
            xField="date" 
            yField="profit"
            displayName="Profit"
            fill="{sc1}"
            stroke="{s1}"
            />
          <mx:ColumnSeries 
            xField="date" 
            yField="expenses"
            displayName="Expenses"
            fill="{sc2}"
            stroke="{s2}"
            />
        </mx:series>
        <mx:verticalAxis>
          <mx:LinearAxis id="lAxis"/>
        </mx:verticalAxis>
      </mx:ColumnChart>
    </mx:HBox>
  </mx:Panel>
</mx:Application>