Flex 柱狀圖2
阿新 • • 發佈:2019-01-26
<mx:Panel title="各線路受影響人數對比圖" width="100%" height="100%"> <common:AmSerialCharts id="char2" width="100%" height="100%" dataProvider="{linePeopArr}" categoryField="lineName" marginBottom="60" marginLeft="50" startDuration="1"> <!--資料顯示樣式 balloonText 繫結資料來源顯示的內容 bullet 折角的點樣式(圓點,方框等) lineThickness="2" 線條的粗細 type 型別(曲線、折現、柱狀圖等) visibleInLegend=false //圖示內容不顯示 showBalloon=false //柱狀圖不顯示 fillAlphas="[1]" 柱狀圖的填充 fillColors="[#5eb451]" 柱狀圖的填充顏色 --> <common:graphs> <amcharts:AmGraph title="滯留人數" balloonText="[[lineName]] :[[peoplenum]]人" valueField="peoplenum" lineColor="#5eb451" color="#000000" type="column" lineThickness="2" bullet="square" fillAlphas="[1]" fillColors="[#5eb451]"/> </common:graphs> <!--設定X軸可顯示的最多資料條數 gridCount={資料來源的長度} gridAlpha 設定背景線的輕重 labelRotation="30" 傾斜角度 如果有漢字顯示則不加此屬性,就能顯示漢字 styleName 樣式,可顯示X軸內容--> <common:categoryAxis> <amcharts:CategoryAxis gridAlpha="0.1" gridCount="{linePeopArr.length}"/> </common:categoryAxis> <!--設定Y軸最大最小數值 min="0" max="6"--> <common:valueAxes> <amcharts:ValueAxis position="left" axisThickness="2" axisColor="#FF0000"/> </common:valueAxes> <!--設定顯示資料框的邊框顏色及樣式--> <common:balloon> <amcharts:AmBalloon cornerRadius="10" borderThickness="2" borderColor="#FFFFFF" borderAlpha="1"/> </common:balloon> <!--滑鼠滑過即顯示資料--> <common:chartCursor> <amcharts:ChartCursor zoomable="false" cursorAlpha="0" categoryBalloonEnabled="false"/> </common:chartCursor> </common:AmSerialCharts> <!--顯示每條線路可點選實現線路隱藏--> <common:AmLegends dataProvider="{chart2}" width="100%" switchType="v" textClickEnabled="false" color="#000000" valueWidth="30" marginBottom="0" marginTop="0" marginRight="0" marginLeft="40"/> </mx:Panel>