漏斗图

使用 FunnelChart 组件创建漏斗/金字塔图。

funnel chart
漏斗图

组件的 XML 名称:chart:funnelChart

数据绑定

  • 可以为图表指定集合数据容器,然后为 funnelChart 元素定义 titleFieldvalueField 属性:

    <chart:funnelChart id="funnel"
                       angle="40"
                       balloonText="[[title]]: [[value]]"
                       dataContainer="titleValueDc"
                       depth3D="100"
                       height="100%"
                       labelPosition="RIGHT"
                       marginLeft="50"
                       marginRight="240"
                       outlineAlpha="1"
                       outlineColor="#FFFFFF"
                       outlineThickness="2"
                       startX="-500"
                       titleField="title"
                       valueField="value"
                       width="100%">
    </chart:funnelChart>
  • 使用 chart:data 元素可以实现 简易数据绑定

    <chart:funnelChart id="ratingChart"
                       titleField="mechanic"
                       valueField="count">
        <chart:data>
            <chart:item>
                <chart:property name="mechanic" value="Jack"/>
                <chart:property name="count" value="1" type="int"/>
            </chart:item>
            <chart:item>
                <chart:property name="mechanic" value="Bob"/>
                <chart:property name="count" value="2" type="int"/>
            </chart:item>
            <chart:item>
                <chart:property name="mechanic" value="Sam"/>
                <chart:property name="count" value="3" type="int"/>
            </chart:item>
        </chart:data>
    </chart:funnelChart>

事件和处理器

如需使用 Jmix Studio 生成处理器的桩代码,需要在界面 XML 描述或者 Component Hierarchy 面板选中该组件,然后用 Component Inspector 面板的 Handlers 标签页生成。

或者可以使用界面控制器顶部面板的 Generate Handler 按钮。

更多细节,参阅 AmCharts 文档