I got everything working! Looks good, but I have one styling issue. If
the chart is filled with null data, when data starts coming in
everything is fine until the moment when the chart fills with data. See
the Before
<http://farm8.staticflickr.com/7067/6775986144_a3c232b945_o.jpg> image.
The problem is with the gradient fill. Once the chart fills up, the
gradient smushes up to the top. See the After
<http://farm8.staticflickr.com/7052/6922100891_eb289b594c_o.jpg> image.
It appears that the LinearGradient only uses the area that is stroked
for computing the height of the fill as far as the gradient goes.
Any ideas?
Here's my gradient definition:
<mx:LinearGradient id="linearGradientFill" rotation="90">
<mx:entries>
<mx:GradientEntry color="#3399BF" ratio="0.5"
alpha="0.9"/>
<mx:GradientEntry color="#3399BF" ratio="0.9"
alpha="0.6"/>
<mx:GradientEntry color="#3399BF" ratio="1"
alpha="0.5"/>
</mx:entries>
</mx:LinearGradient>
Here's where I apply it to the AreaChart:
<mx:AreaSeries id="areaSeries"
yField="value"
xField="time"
form="step"
areaStroke="{solidColorStroke}"
areaFill="{linearGradientFill}"/>
--- In flexcoders@yahoogroups.com, "gtb104" <gtb104@...> wrote:
>
> Ah, OK. I got you. I'll try that. Thanks!
>
> --- In flexcoders@yahoogroups.com, Brendan Meutzner bmeutzner@ wrote:
> >
> > Geoff,
> >
> > Not literally Zero data, but blank data.
> >
> > I modified the following simple example from StackOverflow to show
what you
> > can do... see the link, and then the modified code below.
> >
> >
> >
http://stackoverflow.com/questions/3233357/flex-extending-x-axis-on-line\
chart-for-unknown-future-data
> >
> >
> > <?xml version="1.0"?>
> >
> > <!-- charts/BasicLine.mxml -->
> >
> > <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml";>
> >
> > <mx:Script><![CDATA[
> >
> > import mx.collections.ArrayCollection;
> >
> > [Bindable]
> >
> > public var expenses:ArrayCollection = new ArrayCollection([
> >
> > {Month:"Jan", Profit:3000},
> >
> > {Month:"Feb", Profit:""},
> >
> > {Month:"Mar", Profit:""},
> >
> > {Month:"Apr", Profit:""},
> >
> > {Month:"May", Profit:3000},
> >
> > {Month:"Jun", Profit:2000},
> >
> > {Month:"Jul", Profit:3000},
> >
> > {Month:"Aug", Profit:4000}
> >
> > ]);
> >
> > ]]></mx:Script>
> >
> > <mx:Panel title="Line Chart">
> >
> > <mx:LineChart id="myChart"
> >
> > dataProvider="{expenses}"
> >
> > showDataTips="true"
> >
> > >
> >
> > <mx:horizontalAxis>
> >
> > <mx:CategoryAxis
> >
> > dataProvider="{expenses}"
> >
> > categoryField="Month"
> >
> > />
> >
> > </mx:horizontalAxis>
> >
> > <mx:series>
> >
> > <mx:LineSeries
> >
> > yField="Profit"
> >
> > displayName="Profit"
> >
> > interpolateValues="false"
> >
> > />
> >
> > </mx:series>
> >
> > </mx:LineChart>
> >
> > <mx:Legend dataProvider="{myChart}"/>
> >
> > </mx:Panel>
> >
> > </mx:Application>
> >
> >
> >
> >
> > On Sat, Feb 18, 2012 at 12:06 AM, gtb104 gtb104@ wrote:
> >
> > > **
> > >
> > >
> > > Brendan,
> > >
> > > I think that I understand what you're talking about. Just two
questions.
> > > What's "0" data? Is that just data with a value of zero? Also, how
do I get
> > > the line chart to ignore zero data?
> > >
> > > Thanks,
> > > Geoff
> > >
> > >
> > > --- In flexcoders@yahoogroups.com, Brendan Meutzner <bmeutzner@>
wrote:
> > > >
> > > > Geoff,
> > > >
> > > > You can create a large dataset with empty, or 0 values, for your
Y Axis.
> > > > Then when you populate data from your service, add/append those
values to
> > > > the end of your dataset, while removing an equal number of empty
values
> > > > from the beginning of the dataset. If you've created an
ArrayCollection
> > > of
> > > > these values, then via binding, it will update the chart
automatically as
> > > > you add/remove values to/from this collection. Have your line
chart
> > > ignore
> > > > 0 values and the line won't draw at the beginning, and only
begin drawing
> > > > on the right where you've started populating data.
> > > >
> > > > Continue this process as you receive data, and eventually you
will have a
> > > > full dataset, and as you continue to add/remove values, your
full chart
> > > > line will continue updating appearing to move from right to
left.
> > > >
> > > > Does all this make sense? I've used a Mac for years now, so I'm
pulling
> > > > from memory what the task manager charts look like, but I think
this is
> > > > accurate.
> > > >
> > > > Let me know if you need any clarification on the method I'm
suggesting
> > > > above.
> > > >
> > > >
> > > > Brendan
> > > >
> > > >
> > > > On Wed, Feb 15, 2012 at 12:06 PM, gtb104 <gtb104@> wrote:
> > > >
> > > > > **
> > >
> > > > >
> > > > >
> > > > > Rishi,
> > > > >
> > > > > Sorry, but I don't see how that example fulfills my request.
What I'm
> > > > > trying to show is basically volume over time. The x axis is
time, the y
> > > > > axis is volume. The chart will be feed from BlazeDS messages
that will
> > > be
> > > > > coming in around once per second. I'd like to plot the volume
data
> > > points
> > > > > from right to left, like how the Task Manager plots CPU
performance.
> > > I'm
> > > > > hoping this clarifies my need.
> > > > >
> > > > > Thanks,
> > > > > Geoff
> > > > >
> > > > > --- In flexcoders@yahoogroups.com, "Tandon, Rishi"
<rishitandon123@>
> > > > > wrote:
> > > > > >
> > > > > > Geoff, you can Ãâ check the Stock chart from
amcharts
> > > > > >
http://flex.amcharts.com/examples/stock_chart_exampleÃâ
> > >
> > > > > >
> > > > > >
> > > > > > Regards,
> > > > > > Rishi Tandon
> > > > > >
> > > > > >
> > > > > > ________________________________
> > > > > > From: gtb104 <gtb104@>
> > > > >
> > > > > > To: flexcoders@yahoogroups.com
> > > > > > Sent: Wednesday, February 15, 2012 8:30 PM
> > > > > > Subject: [flexcoders] Line Chart like Task Manager
> > > > > >
> > > > > >
> > > > > > Ãâ
> > >
> > > > > > I'm looking to make a line chart that looks similar to
Windows Task
> > > > > Manager (data comes in from right to left for a fixed period
of time).
> > > > > Looking at the API, it doesn't appear that the LineChart
natively
> > > supports
> > > > > that, and I couldn't find any 3rd party libraries that already
do that.
> > > > > Does anyone have any ideas?
> > > > > >
> > > > > > Thanks,
> > > > > > Geoff
> > > > > >
> > > > >
> > > > >
> > > > >
> > > >
> > >
> > >
> > >
> >
>
