Changing chart series colors with colorpicker

Question

I am trying to implement functionality to allow the user to
select what color he wants a particular series item in a chart to
be. Here's what I'm doing, but it doesn't work. I get the series
object returned correctly, but "setStyle" doesn't do anything.

Answer 1

Alright, I think I have something you're looking for. This
updates the series' color in the legend, too.
<?xml version="1.0"?>
<!-- charts/BasicLine.mxml -->
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml">
<mx:Script><![CDATA[
import mx.collections.ArrayCollection;
import mx.charts.events.ChartItemEvent;
import mx.controls.ColorPicker;
import mx.events.ColorPickerEvent;
import mx.charts.HitData;
import mx.charts.chartClasses.ChartElement;
import mx.graphics.Stroke;
import mx.charts.series.items.LineSeriesItem;
[Bindable]
public var expenses:ArrayCollection = new ArrayCollection([
{Month:"Jan", Profit:2000, Expenses:1500, Amount:450},
{Month:"Feb", Profit:1000, Expenses:200, Amount:600},
{Month:"Mar", Profit:1500, Expenses:500, Amount:300}
private var cp:ColorPicker;
private var csi:LineSeriesItem;
private var el:ChartElement;
private function doSomething(e:ChartItemEvent):void {
var hitData:HitData = e.hitData;
csi = LineSeriesItem(hitData.chartItem);
el = ChartElement(csi.element);
cp = new ColorPicker();
myChart.addChild(cp);
cp.addEventListener(ColorPickerEvent.CHANGE,
changeItemColor);
cp.x = e.localX;
cp.y = e.localY;
cp.open();
private function changeItemColor(e:ColorPickerEvent):void {
var s1:Stroke = new Stroke(cp.selectedColor, 4, 1); //First
3 arguments are color, weight, and alpha.
el.setStyle("lineStroke", s1);
// Use this if it's a column or bar series:
// var c:SolidColor = new SolidColor(cp.selectedColor);
//el.setStyle("fill", c);
//csi.itemRenderer.height = csi.itemRenderer.height;
myChart.removeChild(cp);
]]></mx:Script>
<mx:Panel title="Line Chart">
<mx:LineChart id="myChart"
dataProvider="{expenses}"
showDataTips="true"
itemClick="doSomething(event)"
>
<mx:horizontalAxis>
<mx:CategoryAxis
dataProvider="{expenses}"
categoryField="Month"
/>
</mx:horizontalAxis>
<mx:series>
<mx:LineSeries
yField="Profit"
displayName="Profit"
selectable="true"
/>
<mx:LineSeries
yField="Expenses"
displayName="Expenses"
selectable="true"
/>
</mx:series>
</mx:LineChart>
<mx:Legend dataProvider="{myChart}"/>
</mx:Panel>
</mx:Application>
matt horn
flex docs