Question

请找到以下代码

    <?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
 <![CDATA[
  [Bindable]
        public var testAC:Array = [
           {date:"without", close:50},
           {date:"with", close:45}           
        ];

 ]]>
</mx:Script>
 <mx:ColumnChart id="myChart" dataProvider="{testAC}">
  <mx:horizontalAxis>
   <mx:CategoryAxis categoryField="date"/>
  </mx:horizontalAxis>
  <mx:verticalAxis>
   <mx:CategoryAxis categoryField="close"/>
  </mx:verticalAxis>
  <mx:series>
   <mx:ColumnSeries dataProvider="{testAC}" xField="date" yField="close"/>
   <mx:LineSeries dataProvider="{testAC}" xField="date" yField="close"/>
  </mx:series>
 </mx:ColumnChart>
</mx:Application>

此代码绘制一个包含两列的colum图表，并在两列的顶部绘制一条线。我有两个要求：

该行需要用虚线
截至目前，该行从第一列的右上角开始到第二列的同一角落。如何将线向左移动，使其从第一列的中心开始到第二列的中心。

问候，PK

Answer 1

您可以使用

在笛卡尔图表上的两个值之间绘制一条线

<mx:Script><![CDATA[
    private function connectTwoPoints(
        month1:String, value1:Number, 
        month2:String, value2:Number):void 
    {
        // Draw Line
        canvas.clear();
        canvas.lineStyle(4, 
            0xCCCCCC, 
            .75, 
            true, 
            LineScaleMode.NORMAL, 
            CapsStyle.ROUND, 
            JointStyle.MITER, 
            2);
        canvas.moveTo(month1, value1);
        canvas.lineTo(month2, value2);
    }
]]></mx:Script>

<mx:annotationElements>
    <mx:CartesianDataCanvas id="canvas" includeInRanges="true"/>
</mx:annotationElements>

您绘制的线条将是使用“笛卡尔数据画布”的“注释元素”。注释元素在前景中绘制。完美的例子：
http://livedocs.adobe.com/flex/3/html/help.html?content=charts_eventsandeffects_13.html

Answer 2

对于我的许多具有复杂蒙皮的图表，我一直在使用Axiis。它非常像Degrafa，可以让你在你的'dataCanvas'上放一个degrafa stroke并把它放在任何你喜欢的地方。

这是一个非常直接的例子： http://axiis.org/examples/HClusterStackExample.html

'这不是最好的答案，但使用axiis是如此简单，但它允许复杂的填充和笔画，这是通过mxml不允许使用普通的'flex图表。

祝你好运，杰里米

Answer 3

经过长时间的研究，我终于完成了绘制虚线图。我使用Adobe自己提供的DashedGraphicUtilities绘制虚线。我扩展了LineSeries并使用这个DashedGraphicUtilities绘制虚线。这解决了我的第一个和邮件问题。每当我得到第二个解决方案时，我都会更新。

我也得到了第二个问题的解决方案。当我将图表类型从ColumnChart更改为CartesianChart时，折线图显示我需要的完美。我在其中使用了列系列和线系列，线和列完美无缺。

此致 Anoop

在Flex柱形图的顶部绘制一条虚线

3 个答案: