Ralf,
I'm following your approach, but am not getting the chart to
display...most likely because I'm not creating my series properly.
In my mxml, I have:
[Bindable]
public var _elements:XMLList;
public function createXMLList(data:String):XMLList
{
var _xml:XML = new XML(data);
_elements = _xml.elements();
return _elements;
}
<mx:Panel width="450" height="400" id="panel" >
<mx:LineChart id="chart" height="350" width="300"
paddingLeft="5" paddingRight="5"
showDataTips="true" visible="false"
dataProvider="{_elements}">
</mx:LineChart>
</mx:Panel>
In my html file, I use the XMLHttpRequest to get my xml and do the
following:
function createChart() {
if (req.readystate == 4 && req.status == 200) {
var seriesArray = new Array();
var date;
var flexApp = FABridge.example.root();
var chart = flexApp.getPanel().getChildByName
("chart");
var s = FABridge.example.create
("mx.charts.series.LineSeries");
flexApp.createXMLList(req.responseText);
s.set("yField", "datapoint");
seriesArray.push(s);
chart.setSeries(seriesArray);
chart.setVisible("true");
}
}
My XML file has the following structure:
<?xml version="1.0" encoding="utf-8"?>
<result metricDfn="Price">
<company1 id="1">
<datapoint date="Jan">50</datapoint>
<datapoint date="Feb">60</datapoint>
<datapoint date="Mar">40</datapoint>
<datapoint date="Apr">50</datapoint>
<datapoint date="May">40</datapoint>
</company1>
</result>
Anything obvious that I'm not doing right?
Thanks,
Mehul.
--- In [email protected], "Ely Greenfield" <[EMAIL PROTECTED]>
wrote:
>
>
>
> Mehul -- the problem you're running into is that 'source' is a
special
> compile time property of XML and Model. It's essentially like an
> 'include' statement. So it can't be set at runtime.
>
> Romeo (Private Romeo) -- your approach is fine, and more or less
what I
> would reccomend.
>
> Ely.
>
>
>
>
> ________________________________
>
> From: [email protected]
[mailto:[EMAIL PROTECTED] On
> Behalf Of Private Romeo
> Sent: Wednesday, February 21, 2007 3:50 PM
> To: [email protected]
> Subject: [flexcoders] RE: Accessing a Flex Model via JavaScript
> (FABridge)
>
>
>
> Mehul,
>
> You actually posted to me personally and not back to the list! So I
> reposted...
>
> -----Original Message-----
> From: Private Romeo [mailto:[EMAIL PROTECTED]
> <mailto:freenet%40rottmann.net> ]
> Sent: Donnerstag, 22. Februar 2007 00:37
> To: Mehul Doshi
> Subject: RE: Accessing a Flex Model via JavaScript (FABridge)
>
> Mehul,
>
> It's actually not that "straight forward". FABridge relies on
> introspection.
> It identifies the types used in a Flex application and makes them
> available
> to Java. As a Model could be any complex temp depending solely on
the
> way
> you structure its data, FABridge cannot expose a simple API to
> manipulate
> data provided in an mx:Model (tag).
>
> Let me state that I am pretty new to this, too, and all I am
saying here
> is
> in the state of "as far as I have understood it so far". I am not
one of
> the
> all-time-Flex-gurus (however I am striving to become one some
day :-) ).
>
> Basically what I wanted to achieve is to hand over a chunk of data
from
> within JavaScript to a Flex app in order for the Flex app to bind
it to
> a
> ColumnChart.
>
> My solution - and again, this might not be the "right" way of
doing it -
> involves the following steps:
>
> 1. Created a private var _elements of type XMLList in my MXML app:
>
> [Bindable]
> private var _elements:XMLList;
>
> and bound that to the ColumnChart as the dataProvider:
>
> <mx:ColumnChart x="10" y="61" id="columnChart1"
> dataProvider="{_elements}" showDataTips="true">
>
> 2. Implemented a public changeData() method which accepts a string
and
> converts it into an XML document. In the second step it creates the
> XMLList
> by using the elements() method of the XML instance.
>
> public function updateData(data:String):void
> {
> var _xml:XML = new XML(data);
> _elements = _xml.elements();
> }
>
> This is the method which will be called from within the JavaScript
> through
> FABridge.
>
> 3. In the HTML page I have created a JavaScript method (which
could be
> invoked by a HTML button e.g.) which loads new data to the chart:
>
> function updateData(sampleSet)
> {
> switch (sampleSet)
> {
> case 1:
> var sampleData =
> "<items>"+
>
> "<item><Month>Jan</Month><Sales>100</Sales><People>50</People></ite
m>"+
>
> "<item><Month>Feb</Month><Sales>200</Sales><People>100</People></it
em>"+
>
> "<item><Month>Mar</Month><Sales>300</Sales><People>150</People></it
em>"+
> "</items>";
> break;
> case 2:
> var sampleData =
> "<items>"+
>
> "<item><Month>Jan</Month><Sales>200</Sales><People>100</People></it
em>"+
>
> "<item><Month>Feb</Month><Sales>300</Sales><People>150</People></it
em>"+
>
> "<item><Month>Mar</Month><Sales>100</Sales><People>50</People></ite
m>"+
> "</items>";
> break;
> }
> alert("JavaScript is going to pass the following data to the Flex
> chart: \n\n"+sampleData);
> var flexApp = FABridge.flash.root();
> flexApp.updateData(sampleData);
> }
>
> This works perfectly fine for me. The nice thing is that even if I
add
> another category (April, May, etc.) the chart automatically
adjusts, so
> this
> simple approach is quite flexible.
>
> I hope this helps a bit.
>
> As I said, I am new to this. Maybe other Flexcoders contributers
could
> comment on my approach? Is this a "good" way of doing it? Is it
> overcomplicated? What is the "recommended" way?
>
> -Ralf
>
> -----Original Message-----
> From: [email protected] <mailto:notify%40yahoogroups.com>
> [mailto:[email protected] <mailto:notify%40yahoogroups.com> ]
On
> Behalf Of
> Mehul Doshi
> Sent: Mittwoch, 21. Februar 2007 22:26
> To: Private Romeo
> Subject: Re: Accessing a Flex Model via JavaScript (FABridge)
>
> Ely,
>
> Along the same lines as Ralf's question, if in my MXML, I have a
> model defined as:
>
> <mx:Model id="chartModel" />
>
> and I wish to set the model's xml source in my html file, how
would
> that happen? something like...
>
> var flexApp = FABridge.flash.root();
> var model = flexApp.getChartModel();
> model.setSource("data.xml");
>
> No setSource method seems to exist. How can I find out what
methods
> are available on the model object?
>
> Also, if I next need to set my chart's dataProvider, would that be
> something like...
>
> chart.setDataProvider(model.result);
>
> I'll greatly appreciate some help on this.
>
> Thanks,
> Mehul.
> --- In [email protected] <mailto:flexcoders%
40yahoogroups.com>
> , "Private Romeo" <freenet@>
> wrote:
> >
> > Ely,
> >
> >
> >
> > Thanks for clarification. Maybe we are contemplating the wrong
> approach here
> > and you can be of some more general help.
> >
> >
> >
> > We want to manipulate data bound to a Flex Charting Column
Control
> from
> > outside the Flash movie. Therefore we consider calling a method
in
> the Flash
> > movie via the FABridge and pass along the changed data. This is,
> where we
> > run into problems as we do not seem to get the right data types.
> >
> >
> >
> > Could a multi-dimensional JavaScript Array do? What would be
your
> advice to
> > reach our above described objective?
> >
> >
> >
> > Best regards
> >
> > Ralf
> >
> >
> >
> > From: [email protected] <mailto:flexcoders%
40yahoogroups.com>
>
> [mailto:[email protected] <mailto:flexcoders%
40yahoogroups.com>
> ] On
> > Behalf Of Ely Greenfield
> > Sent: Montag, 19. Februar 2007 18:02
> > To: [email protected] <mailto:flexcoders%
40yahoogroups.com>
> > Subject: RE: [flexcoders] Accessing a Flex Model via JavaScript
> (FABridge)
> >
> >
> >
> >
> >
> >
> >
> >
> >
> > The FABridge relies on the ability to introspect actionscript
> types and
> > create proxies in javascript for classes, methods. and
properties
> on the
> > fly. Since Model is dynamic it can't be introspected by the
> current bridge
> > behavior, so you can't manipulate it directly through the Bridge.
> >
> >
> >
> > You have three options:
> >
> >
> >
> > 1) the bridge has low level APIs for setting and getting
> properties, and
> > calling methods, on an arbitrary object reference. You can see
if
> using
> > these to access members of the model fixes your problem.
> >
> >
> >
> > 2) if you know in advance what type of manipulations you want to
> do to your
> > model, you can write methods in your application to do them, and
> call those
> > (with parameters) from your javascript.
> >
> >
> >
> > 3) use a strongly typed class based model rather than the
generic
> model tag.
> >
> >
> >
> > Ely.
> >
> >
> >
> >
> >
> > _____
> >
> > From: [email protected] <mailto:flexcoders%
40yahoogroups.com>
>
> [mailto:[email protected] <mailto:flexcoders%
40yahoogroups.com>
> ] On
> > Behalf Of Private Romeo
> > Sent: Monday, February 19, 2007 7:17 AM
> > To: [email protected] <mailto:flexcoders%
40yahoogroups.com>
> > Subject: [flexcoders] Accessing a Flex Model via JavaScript
> (FABridge)
> >
> > I've got the following model in my MXML app (bound to a column
> chart
> > control):
> >
> >
> >
> > <mx:Model id="sampleData">
> >
> > <items>
> >
> > <item>
> >
> > <Month>January</Month>
> >
> > <Sales>1000</Sales>
> >
> > <People>3</People>
> >
> > </item>
> >
> > <item>
> >
> > <Month>February</Month>
> >
> > <Sales>1200</Sales>
> >
> > <People>5</People>
> >
> > </item>
> >
> > </items>
> >
> > </mx:Model>
> >
> >
> >
> > and by using the FABridge I want to change the data within
> JavaScript:
> >
> >
> >
> > flexApp.getMyLabel().setText("Updated via JavaScript!");
> >
> > var sampleData = flexApp.getSampleData();
> >
> > sampleData[1].Sales=50;
> >
> >
> >
> > however the last line seems to not work. How do I make it work?
> >
> >
> >
> > Your help is greatly appreciated.
> >
> >
> >
> > R.
> >
>
