Try this...
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml";
xmlns:local="*"
creationComplete="onCreationComplete()">
<mx:Style>
.noGutterChart
{
gutterLeft:0;
gutterBottom:0;
gutterTop:0;
gutterRight:0;
}
</mx:Style>
<mx:Script>
<![CDATA[
private var myComp:ChartComp;
private function onCreationComplete():void
{
myComp = new ChartComp;
addEventListener("myChartCompleted",
onmyChartCompleted);
chartPanel.addChild(myComp);
}
private function onmyChartCompleted(event:Event):void
{
myComp.myChart.styleName = 'noGutterChart';
}
]]>
</mx:Script>
<mx:Panel title="Column Chart" id="chartPanel"/>
</mx:Application>
ChartComp.mxml:
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml";
creationComplete="dispatchEvent(new Event('myChartCompleted', true,
true))">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable] public var expenses:ArrayCollection = new
ArrayCollection([
{Month:"Jan", Profit:2000, Expenses:1500},
{Month:"Feb", Profit:1000, Expenses:200},
{Month:"Mar", Profit:1500, Expenses:500}
]);
]]>
</mx:Script>
<mx:ColumnChart id="myChart" dataProvider="{expenses}"
showDataTips="true">
<mx:horizontalAxis>
<mx:CategoryAxis dataProvider="{expenses}"
categoryField="Month"/>
</mx:horizontalAxis>
<mx:series>
<mx:ColumnSeries xField="Month" yField="Profit"
displayName="Profit"/>
<mx:ColumnSeries xField="Month" yField="Expenses"
displayName="Expenses"/>
</mx:series>
</mx:ColumnChart>
</mx:Canvas>
--- In [email protected], Vivian Richard <kanps...@...> wrote:
>
> I just tried as suggested and still the same. May be it does
not get
> instantiated
> until it is added in its parent. May be!!!
>
>
>
> On Fri, Jan 15, 2010 at 10:50 AM, valdhor [email protected]:
>
> >
> >
> > Hmmmmm I don't use charts.
> >
> > Maybe you could try...
> >
> > myComp.myChart.styleName = "noGutterChart";
> >
> > Actaully, the myChart component may not have been instantiated at
that
> > point. I would add a creationComplete event handler to the myChart
component
> > that dispatches a custom event that will bubble up to the component
that you
> > are in. When that event comes in, apply the style.
> >
> >
> > --- In [email protected] <flexcoders%40yahoogroups.com>,
Vivian
> > Richard kanpsack@ wrote:
> > >
> > > Actually I am trying to apply a very simple style to a chart. My
chart is
> > > inside a
> > > canvas component and in a separate file. I want to add this chart
> > containing
> > > canvas in dynamically. This component is like this:
> > >
> > > <?xml version="1.0" encoding="utf-8"?>
> > > <mx:Canvas width .....>
> > > <mx:ColumnChart .... id ="myChart">
> > > </mx:ColumnChart>
> > > </mx:Canvas>
> > >
> > > Now I have this simple styles for the the chart which are:
> > >
> > > .noGutterChart {
> > > gutterLeft:0;
> > > gutterBottom:0;
> > > gutterTop:0;
> > > gutterRight:0;
> > > }
> > >
> > > Now as I am trying to create the component dunamically and want to
apply
> > > the
> > > style to the chart I get the error message.
> > >
> > > var myComp:ChartComp = new ChartComp;
> > > myComp.myChart.setStyle("styleName","noGutterChart");
> > >
> > > This gives me the error message that I cannot access a function of
a
> > > null object.
> > >
> > >
> > >
> > >
> > >
> > >
> > >
> > >
> > > On Fri, Jan 15, 2010 at 9:49 AM, valdhor valdhorli...@wrote:
> >
> > >
> > > >
> > > >
> > > > In that case he should use the styleName property...
> > > >
> > > > .myStyle
> > > > {
> > > > cornerRadius: 9;
> > > > fillAlphas: 1, 1, 1, 1;
> > > > fillColors: #6699ff, #6699ff, #6699ff, #6699ff;
> > > > themeColor: #00ff00;
> > > > fontSize: 24;
> > > > }
> > > >
> > > >
> > > > var button:Button = new Button;
> > > > button.label = "My Fancy New Button";
> > > > button.styleName = "myStyle";
> > > > this.addChild(button);
> > > >
> > > >
> > > > --- In [email protected]
<flexcoders%40yahoogroups.com>, Erik
> > de Bruin <erikdebruin@> wrote:
> > > > >
> > > > > Hi,
> > > > >
> > > > > I think he's trying to set a named CSS style ("myStyle") on
the
> > Button
> > > > using
> > > > > setStyle(). I don't think that's possible?
> > > > >
> > > > > EdB
> > > > >
> > > > > On Fri, Jan 15, 2010 at 3:02 PM, valdhor valdhorlists@:
> >
> > > >
> > > > >
> > > > > >
> > > > > >
> > > > > > I don't understand. Once you use the "new" operator, the
button is
> > > > > > instantiated. You can apply all sorts of styles to it before
adding
> > it
> > > > to
> > > > > > the displayList. For example, this works for me...
> > > > > >
> > > > > > var button:Button = new Button;
> > > > > > button.label = "My Fancy New Button";
> > > > > > button.setStyle("cornerRadius", 9);
> > > > > > button.setStyle("fontSize", 24);
> > > > > > button.setStyle("themeColor", '#00FF00');
> > > > > > button.setStyle("fillColors", ['#6699ff', '#6699ff',
> > > > > > '#6699ff', '#6699ff']);
> > > > > > button.setStyle("fillAlphas", [1, 1, 1, 1]);
> > > > > > this.addChild(button);
> > > > > >
> > > > > >
> > > > > >
> > > > > > --- In [email protected]
<flexcoders%40yahoogroups.com>,
> > "hworke" kanpsack@ wrote:
> > > > > > >
> > > > > > >
> > > > > > >
> > > > > > > Hi I am trying to apply style in a newly created component
> > > > > > > but since it is not instantiated it gives me error
message.
> > > > > > >
> > > > > > > My code is like this:
> > > > > > >
> > > > > > > var button:Button = new Button;
> > > > > > > button.setStyle("styleName", "myStyle");
> > > > > > > canvas.addChild(button);
> > > > > > > I need to create the component dynamically and also need
> > > > > > > to apply the style dynamically. How can I do that?
> > > > > > >
> > > > > > > Regards,
> > > > > > >
> > > > > >
> > > > > >
> > > > >
> > > > >
> > > > >
> > > > > --
> > > > > Ix Multimedia Software
> > > > >
> > > > > Jan Luykenstraat 27
> > > > > 3521 VB Utrecht
> > > > >
> > > > > T. 06-51952295
> > > > > I. www.ixsoftware.nl
> > > > >
> > > >
> > > >
> > >
> >
> >
> >
>
