apache-flex 在Adobe Flex饼图中计算每个扇区的百分比

wbrvyc0a 于 2022-10-31 发布在 Apache

关注(0)|答案(2)|浏览(131)

我在Adobe Flash Builder 4.5中制作了一个甜甜圈饼图，在鼠标悬停期间显示每个扇区的工具提示。我想知道应用程序是如何计算和显示每个扇区的百分比的，即使我只是在数组集合中提供值，而下面给出的代码中没有使用公式。
请帮帮忙
我的完整代码..

<?xml version="1.0" encoding="utf-8"?>
 <!-- http://blog.flexexamples.com/2007/10/13/creating-donut-shaped-pie-charts-using-the-innerradius-style/ -->
 <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
            layout="vertical"
            verticalAlign="middle"
            backgroundColor="white">

<mx:Script>
    <![CDATA[
        private function labelFunc(item:Object, field:String, index:Number, percentValue:Number):String {
            return item.name + ": " + '\n' + "AVG: " + item.avg;
        }
    ]]>
</mx:Script>

<mx:ArrayCollection id="arrColl">
    <mx:source>
        <mx:Array>
            <mx:Object name="R Winn" obp=".353" slg=".445" avg=".300" />
            <mx:Object name="P Feliz" obp=".290" slg=".418" avg=".253" />
            <mx:Object name="O Vizquel" obp=".305" slg=".316" avg=".246" />
            <mx:Object name="B Molina" obp=".298" slg=".433" avg=".276" />
            <mx:Object name="R Durham" obp=".295" slg=".343" avg=".218" />
        </mx:Array>
    </mx:source>
</mx:ArrayCollection>

<mx:PieChart id="chart"
             height="100%"
             width="100%"
             innerRadius="0.5"
             showDataTips="true"
             dataProvider="{arrColl}" >
    <mx:series>
        <mx:PieSeries labelPosition="callout"
                      field="avg"
                      labelFunction="labelFunc">
            <mx:calloutStroke>
                <mx:Stroke weight="0"
                           color="0x888888"
                           alpha="100"/>
            </mx:calloutStroke>
            <mx:radialStroke>
                <mx:Stroke weight="0"
                           color="#FFFFFF"
                           alpha="20"/>
            </mx:radialStroke>
            <mx:stroke>
                <mx:Stroke color="0"
                           alpha="20"
                           weight="2"/>
            </mx:stroke>
        </mx:PieSeries>
    </mx:series>
</mx:PieChart>

    </mx:Application>

这是输出的屏幕截图，即饼图

我想知道值23.2%是如何显示为橙子扇区的工具提示，即使我没有在代码中的任何地方编写它..如果调用sdk的任何函数来计算百分比，那么它在哪里？

apache-flex

来源：https://stackoverflow.com/questions/24488664/calculating-percentage-of-each-sector-in-adobe-flex-pie-chart

2条答案

按热度按时间

kkih6yb81#

你说的完全正确- Flex已经为你做了这件事。我自己也在做类似的事情，所以很抱歉necropost。这需要快速浏览SDK，特别是PieSeries.as，updateMapping函数中的第1772行，其中设置了percentValue属性。

for (i = 0; i < n; i++)
 {
     _renderData.cache[i].percentValue = _renderData.cache[i].number/total;
 }

_renderData可以通过调用在第468行找到的系列的items属性来访问。

override public function get items():Array /* of PieSeriesItem */
{
    return _renderData ? _renderData.filteredCache : null;
}

因此，如果您想知道PieSeries中索引为3的项目所占的百分比，您可以执行以下操作：

var item3Percent:Number = chart.series[0].items[3].percentValue;

赞(0）回复(0）举报 2022-10-31

tkclm6bt2#

您不需要自定义公式来计算此百分比，这是一个标准计算，饼图必须执行此计算，以便给予每个值的饼图大小。
当你在chart对象上设置field和dataProvider时，所有需要的信息都被提供了。虽然我不能提供这里运行的确切代码，但它是一个简单的近似值：

function getRowPercentValue(row:Object):Number
{
    return (row[field] / getTotalFieldValue()) * 100
}
function getTotalFieldValue():Number
{
    var returnVal:Number = 0;
    for each(var row:Object in dataProvider)
    {
        returnVal += row[field];
    }
    return returnVal;
}

请注意，这是一个伪代码，饼图将比这更优化，并将做聪明的事情（如使用row.valueOf()，如果field == undefined等）。
至于为什么显示在这里，这将是工具提示渲染器的一部分，您可以看到您的自定义labelFunc正在处理图表中的线条

赞(0）回复(0）举报 2022-10-31

我来回答

apache-flex 在Adobe Flex饼图中计算每个扇区的百分比

2条答案

相关问题

热门标签

最新问答