Skip navigation
nabnub
Currently Being Moderated

Change the default colours in line chart

Nov 17, 2012 9:02 AM

Tags: #line #change #chart #in #default #the #colours

hi everyone,

 

 

I'am a new user in Flex, and I am facing my first barrier

 

I am using a code to interact a table and a graph

 

the defaults colours of the lines are orange and a kind of green

 

I would like to change these colours to red and pure green if it's possible

 

here is my code

 

 

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
 layout="absolute" width="600" height="600" 
 creationComplete="init()" applicationComplete="stage.scaleMode = StageScaleMode.EXACT_FIT;">
<mx:Script>
 <![CDATA[
  
[Bindable] private var chartData:XML;
private function init():void 
{
 //Inject the JavaScript functions we need to interface with the RMA
 //You can find the scripts below in the acroJSFunctions string object
 ExternalInterface.call(eval, acroJSFunctions);
 //set up callback for upadtes
 //the format script in each of the fields uses callAS to send the field name and it's value to the RMA
 //the function for this callback then modifies the XML that drives the chart.
 ExternalInterface.addCallback(changeData, changeData);
 //set up callbacks for commenting
 ExternalInterface.addCallback( multimedia_getState, getState );
 ExternalInterface.addCallback(multimedia_setState, setState); 
 loadDefaultXML();
} 
private function loadDefaultXML():void
{
  var req:URLRequest = new URLRequest(defaultChartData.xml);
 var loader:URLLoader = new URLLoader(req);
 loader.addEventListener(complete, xmlLoaded);
}
private function xmlLoaded(event:Event):void
{
    chartData = new XML(event.target.data);
    loadDataFromAcroFields(); 
} 

private function loadDataFromAcroFields():void
{
    //get the values from the PDF
    //
    var c:int;
    var r:int;
    for (c=0;c<2;c++)
 {
   for (r=0;r<16;r++)
  {       
      var result:String = ExternalInterface.call(getFieldValue,r, c);
      chartData.children()[r].children()[c] = int(result);
  }
 } 
}    
 
private function changeData(name:String, value:String):void
{
 //this function gets called when the field value in the PDF file changes
 //look in the format script for the field in the PDF.
 //the field name is in the form table.r.c where r is the row number and c is the column.
 //So the first field in the table would be called table.0.0
 //By splitting the string into an array, I can modify the corresponding element in the XML object that drives the chart.
 var fieldNameArray:Array = name.split(.);
 var row:int = int(fieldNameArray[1]);
 var column:int = int(fieldNameArray[2]);
 var val:int = int(value);
 chartData.children()[row].children()[column] = val
}   
private function getState():String
{
 //store the chart data XML
 return chartData.toString();
}
private function setState(stateData:String):Boolean
{
 chartData = new XML(stateData);
 var c:int;
 var r:int;
    for (c=0;c<2;c++)
 {
   for (r=0;r<16;r++)
  {       
      var fieldVal:String = chartData.children()[r].children()[c].toString();
      var result:String = ExternalInterface.call(setFieldValue,r, c, fieldVal); 
  }
 }
 
 return true;
}
     
     
 ]]>
</mx:Script>
<mx:String id="acroJSFunctions">
<![CDATA[
function getFieldValue(row, column)
{
    fieldName=table.+row+.+column;
    fieldValue = this.getField(fieldName).value;
    return fieldValue; 
}
function setFieldValue(row, column, value)
{
    fieldName=table.+row+.+column;
    this.getField(fieldName).value = value;
}
]]>
</mx:String>
<mx:SeriesInterpolate id="interpolateIn" duration="1000"/>
<mx:Canvas backgroundColor="#FFFFFF" width="100%" height="100%" horizontalScrollPolicy="off" verticalScrollPolicy="off" borderStyle="solid" borderThickness="1" borderColor="#000000">
    <mx:LineChart id="chart" dataProvider="{chartData.totals}" showDataTips="true" 
     left="10" top="10" right="10" bottom="10">
     <mx:horizontalAxis>
      <mx:CategoryAxis categoryField="Day"/>
  </mx:horizontalAxis>
  <mx:series>
   <mx:LineSeries yField="FY06" displayName="No. errors" showDataEffect="{interpolateIn}"/>
   <mx:LineSeries yField="FY07" displayName="No. lines" showDataEffect="{interpolateIn}"/>

  </mx:series>
 </mx:LineChart>
     <mx:Legend dataProvider="{chart}" right="25" bottom="25" borderStyle="outset"/>
</mx:Canvas>     
</mx:Application>

 

I've tried to read this post: http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf 69084-7c5c.html#WS2db454920e96a9e51e63e3d11c0bf6568f-7ff5

 

then I've tried to understand how can I modify and insert the following code to mine, I've tried but doesn't work

 

 

<mx:series>
           <mx:LineSeries yField="profit" displayName="Profit">
            <mx:lineStroke>
                <mx:SolidColorStroke 
                    color="0x0099FF" 
                    weight="20" 
                    alpha=".2"/>
            </mx:lineStroke>                
           </mx:LineSeries>
           <mx:LineSeries yField="expenses" displayName="Expenses">
            <mx:lineStroke>
                <mx:SolidColorStroke 
                    color="0x0044EB" 
                    weight="20" 
                    alpha=".8"/>
            </mx:lineStroke>                
           </mx:LineSeries>
        </mx:series>

 

 

can you please help me?

 

thanks a lot

 

 

 

Win 7 64 bits

Adobe Flash Builder 4.6 Premium

 

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points