[ 3 posts ]

Lilliam Fernández

  • Username: lilliam
  • Joined: Fri Jul 06, 2012 7:12 am
  • Posts: 5
  • Location: Habana, Cuba.
  • Offline
  • Profile

How change colors to bar chart?

Post Posted: Tue Jul 10, 2012 7:31 am
+0-
Hi , I am trying to change the color of the bars in my chart, but this don't seem to be working:
var myChart = new Y.Chart({
type: typeChart,
legend: {
position: "right",
width: 300,
height: 300,
styles: {
hAlign: "center",
hSpacing: 4
}
},
axes: {
category: {
keys: [pCategoryKey],
type: "category",
styles: {
label: {
rotation: -45
}
}
}
},
categoryKey: pCategoryKey,
dataProvider:dataSource,
horizontalGridlines: true,
verticalGridlines: true,
render:renderId
});
var colors = ["#41ab5d", "#4eb3d3", "#ef6548"];
var mySeries = myChart.getSeries(0);
mySeries._styles.marker.fill.colors = colors;
return myChart;

I change my series values dynamically so I can't name them before.
This don't work either:
series:{
styles:{
marker:{
fill:{
colors: ["#41ab5d", "#4eb3d3", "#ef6548"];
}
}
}
},

Tripp Bridges

YUI Developer

  • Username: tripp
  • Joined: Wed Jan 07, 2009 1:54 pm
  • Posts: 435
  • GitHub: tripp
  • Gists: tripp
  • YUI Developer
  • Offline
  • Profile

Re: How change colors to bar chart?

Post Posted: Tue Jul 10, 2012 8:07 am
+0-
I cannot tell from your sample code whether you are trying to style the colors of a chart with 3 series or if you have one series that you want to style with multiple colors. Below are examples of how you could handle either scenario.

This code would set your color array to alternate within a single series:
Code:
var colors = ["#41ab5d", "#4eb3d3", "#ef6548"];
var mySeries = myChart.getSeries(0);
mySeries.set("styles", {
    marker: {
        fill: {
            color:  colors
        }
    }
});


This code would set the fill colors for multiple series:
Code:
myChart.set("styles", {
    series: [
    {
        fill: {
            color: "#41ab5d"
        }
    },
    {
        fill: {
            color: "#4eb3d3"
        }
    },
    {
        fill: {
            color: "#ef6548"
        }
    }
]});


Thanks,
Tripp

Lilliam Fernández

  • Username: lilliam
  • Joined: Fri Jul 06, 2012 7:12 am
  • Posts: 5
  • Location: Habana, Cuba.
  • Offline
  • Profile

Re: How change colors to bar chart?

Post Posted: Tue Jul 10, 2012 9:58 am
+0-
Thanks to you!
I have multiple series so I'm using the second example.
Have a nice day!
  [ 3 posts ]
Display posts from previous:  Sort by  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum