flex柱状图

时间:2021-09-13 19:39:47

柱状图的展现是通过flex自带的控件实现

flex柱状图

flex柱状图

控件解析:
<mx:ColumnChart id = “columns” dataProvider = “{dataSource}” showDataTips = “true”>
//showDataTips 鼠标移动时的提示
<mx:horizontalAxis>
<mx:CategoryAxis id = “h1” categoryField = “typeNme” /> //X轴上展示内容
</mx:horizontalAxis>
<mx:hroizontalAxisRenderers>
<ms:AxisRenderer fontSize = “7” laberRotation = ‘”-45” axis = “{h1}” /> //调整数据边界 确保不出界
</mx:horizontalAxisRenderers>
<mx:series>
<mx:ColomnSeries displayName = “数量” yFied = “resCount” /> //y轴展示的内容
</mx:series>
</mx:ColumnChart>

效果如图

flex柱状图