CSS for BarSeries and ColumnSeries

     
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal">
  <mx:Style>
    @namespace mx "http://www.adobe.com/2006/mxml";
    mx|BarSeries, mx|ColumnSeries {
      fills:#333333,#999999,#CCCCCC;
    }
  </mx:Style>
  <mx:Model id="salesModel">
    <data>
        <row>
          <fruit>A</fruit>
          <sales>1</sales>
        </row>
        <row>
          <fruit>B</fruit>
          <sales>2</sales>
        </row>
    </data>
  </mx:Model>
  <mx:ArrayCollection id="salesData" source="{salesModel.row}"/>

  <mx:Panel title="Bar Chart" height="100%" width="100%">
    <mx:BarChart dataProvider="{salesData}" height="100%" width="100%">
      <mx:verticalAxis>
        <mx:CategoryAxis dataProvider="{salesData}"  categoryField="fruit"/>
      </mx:verticalAxis>
      <mx:series>
        <mx:BarSeries xField="sales" yField="fruit"/>
      </mx:series>
    </mx:BarChart>
  </mx:Panel>

  <mx:Panel title="Column Chart" height="100%" width="100%">
    <mx:ColumnChart dataProvider="{salesData}" height="100%" width="100%">
      <mx:horizontalAxis>
        <mx:CategoryAxis dataProvider="{salesData}" categoryField="fruit"/>
      </mx:horizontalAxis>
      <mx:series>
        <mx:ColumnSeries xField="fruit" yField="sales"/>
      </mx:series>
    </mx:ColumnChart>
  </mx:Panel>
</mx:Application>

Related examples in the same category

1.	A bar chart with a vertical axis
2.	Setting fills with CSS for BarChart
3.	Set up legend for Bar chart
4.	Series for Bar chart
5.	Bar Chart with ArrayCollection
6.	Dynamically size Bar chart
7.	Defines a line width of 2 pixels, with a dark/light gray border for BarChart
8.	BarChart
9.	Basic BarChart Size
10.	A simple BarChart control with data from asp.net
11.	Vertical Axis as the data series
12.	Gradient Fills In ActionScript
13.	Setting the direction of legends
14.	Legend with a border and title bar
15.	Name data series by using the displayName property of the series:
16.	Showing multiple DataTips
17.	Define a new callback function, dtFunc, that returns a formatted value for the DataTip:
18.	Create a custom legend in ActionScript.
19.	Creating charts in ActionScript
20.	Sets the angle property to 90, which specifies that the transition occurs from the top of the chart to the bottom.
21.	Use a LinearGradient class with three colors for a gradient fill of the chart's background:
22.	Use fills to set the background of the charts
23.	To enable DataTips, set the value of the chart control's showDataTips property to true
24.	Use ColumnSet, BarSet, and AreaSet classes to combine groups of chart series,
25.	Add a Legend to a chart in ActionScript

CSS for BarSeries and ColumnSeries : Bar Chart « Chart « Flex

Related examples in the same category