如何在 Flex 折线图的水平轴上显示按年份分组的月份？答案

【问题标题】：How do I show Months Grouped By Years on the horizontal Axis for a Flex Line Chart?如何在 Flex 折线图的水平轴上显示按年份分组的月份？
【发布时间】：2010-11-04 02:16:48
【问题描述】：

基本上我有一个 Flex 折线图，x 轴看起来像这样：

 ---|--------|--------|--------|--------|--------|--------|---
 November December January February   March    April     May

这很好，但我还想显示月份所属的年份，如下所示：

 ---|--------|--------|--------|--------|--------|--------|---
 November December January February   March    April     May
       2010           |                2011

我的 dataprovider 是一个 xml 文档，如下所示：

<Chart>
    <Month count="1"  month="November" year="2010" />
    <Month count="5"  month="December" year="2010" />
    <Month count="0"  month="January"  year="2011" />
    <Month count="10" month="February" year="2011" />
    <Month count="3"  month="March"    year="2011" />
    <Month count="9"  month="April"    year="2011" />
    <Month count="3"  month="May"      year="2011" />
</Chart>

这就是我为 LineChart 控件所拥有的：

<mx:LineChart 
    height="100%" 
    width="100%" 
    dataProvider="{this._report.Month}">
    <mx:backgroundElements>
        <mx:GridLines>
            <mx:horizontalStroke>
                <mx:Stroke color="0x000000" weight="1" />
            </mx:horizontalStroke>
        </mx:GridLines>
    </mx:backgroundElements>
    <mx:horizontalAxisRenderers>
        <mx:AxisRenderer
            axis="{months}"
            axisStroke="{axis}"
            placement="bottom"
            tickLength="5"
            tickPlacement="outside"
            labelRotation="45">
            <mx:tickStroke>{ticks}</mx:tickStroke>
        </mx:AxisRenderer>
    </mx:horizontalAxisRenderers>
    <mx:verticalAxisRenderers>
        <mx:AxisRenderer
            axis="{countForMonths}"
            axisStroke="{axis}"
            placement="bottom"
            tickLength="5"
            tickPlacement="outside"
            minorTickPlacement="none">
            <mx:tickStroke>{ticks}</mx:tickStroke>
        </mx:AxisRenderer>
    </mx:verticalAxisRenderers>
    <mx:horizontalAxis>
        <mx:CategoryAxis id="months" categoryField="@month"/>
    </mx:horizontalAxis>
    <mx:verticalAxis>
        <mx:LinearAxis id="countForMonths" />
    </mx:verticalAxis>
    <mx:series>
        <mx:LineSeries
            yField="@count" 
            displayName="Report" 
            lineStroke="{myreportstroke}"/>
    </mx:series>
</mx:LineChart>

我花了几个小时试图找到一个做类似事情但没有运气的例子。 Flex 文档有几个示例在 y 轴上显示多个轴，但在 x 轴上没有显示。

我已经看到其他人发布的其他几个问题，他们想做类似的事情，但他们中的大多数人从未得到答案，或者答案是查看多个轴的文档 - 我已经完成了。

我在 IBM 网站上找到了 this 的其中一个 Flex 组件。这似乎表明可以按照我想要的方式格式化轴。我只需要有人引导我朝着正确的方向前进。

【问题讨论】：

你真的解决了这个问题吗？
不，我最终放弃了。我最终使用 labelFunction 来格式化 x 轴上的标签，即 2010 年 12 月、2011 年 1 月、2011 年 2 月等。我很确定这是可能的，我很沮丧，经过数小时的搜索，我没有去过能够找到任何例子。

标签： apache-flex charts flex3 linechart

【解决方案1】：

非常有趣的问题。要去调查一下。我的起点将在这里：http://christianyates.com/blog/flex/displaying-multiple-axes-single-series-flex-charts

【讨论】：

感谢您的回复。我快速浏览了您提供的链接，它看起来确实很有希望。我暂时把这个问题放在一边，有空我会仔细研究一下。