We Keep Coding

jqplot set custom color for pie charts based on label name

To plot my data I'm using jqplot. I wish I could set a specific color on my pie chart according to the label values.
For example, I have this set of labels: "wood", "plastic" and I would like to set the color for "Wood" to brown and every time that category shows up in a graph.
Here is my current code:
switch(attrs.type) {
case 'pie': return $.extend(config, {
seriesColors:['#4bb2c5', '#EAA228', '#c5b47f', '#579575', '#839557', '#958c12', '#953579', '#4b5de4', '#d8b83f', '#ff5800', '#0085cc', '#c747a3', '#cddf54', '#FBD178', '#26B4E3', '#bd70c7'],
seriesDefaults: {
shadow: false,
renderer: $.jqplot.PieRenderer,
rendererOptions: {
showDataLabels: true,
varyBarColor: true
},
}
}
);
Thanks in advance!

You can use the dataLabels, seriesColors and labels property(of legends) to achieve this.
Refer below for jqPLot docs
dataLabels
seriesColors
legend labels
I have created a fiddle. Is this something that you are looking out for?
Follow this link: jqPLot Pie Chart - Series labels and colors
Regards,
Anish

jQPlot Horizontal Bar Graph - assign names to Y Axis

I figured it out:
I was not including the jqplot.CategoryAxisRenderer. Once I included that, I was able to get it working.
Thanks, everyone!
UPDATE:
My code works in JSFiddle, so it's a CSS problem I'm having. Please disregard.
I'm trying to create a fairly simple bar chart in jQPlot. I'm expecting two horizontal bars, one on top of the other. Both are equal to 1 on the X axis. I want the Y axis to have the labels 'In Progress' for the top bar, and 'Apr 2014' for the bottom bar. I have tried numerous combinations. If I do not specify Ticks, then I see the two bars. Specifying Ticks, or using the desired labels as the Y axis data point just shows both labels overlapping with no bars. (ignore the setTimeout) Thanks in advance.
Here's the code:
var data = [[1,1],[1,2]];
var ticks = ['In Progress','Mar 2014'];
$(function () {
setTimeout(function(){
var plot1 = jQuery.jqplot ('chartdiv', [data],
{
seriesDefaults: {
renderer:$.jqplot.BarRenderer,
rendererOptions: {
barDirection: 'horizontal'
},
},
axes: {
yaxis: {
renderer: $.jqplot.CategoryAxisRenderer,
ticks: ticks
}
}
});
},
100);
});

I have modified the JsFiddle given by Batu Zet previously adding following lines in order to label your bar chart here :
series: [
{
pointLabels:{
show:true,
labels:['Apr 2014', 'Apr 2014']
}
},
{
pointLabels:{
show:true,
labels:['In Progress', 'In Progress']
}
}
]
P.S : The labels are duplicated for each serie in order to display the same label for two points in a serie.

Highcharts y axis thousands separator

How to add a thousands separator to the Y Axis of Highcharts?
This is what I have:
yAxis: [{ // Primary yAxis
labels: {

In addition to what #jfrej suggested:
If you're directly formatting an axis, use {value} for both yAxis and xAxis:
Fiddle for yAxis format
Fiddle for xAxis format
If you're formatting a point in a tooltip, you may want to use {point.y} and/or {point.x}:
Fiddle for tooltip.pointFormat
Fiddle for tooltip.pointFormat with valueSuffix extension
If you're directly formatting the point label, you may want to use {x} and/or {y}:
Fiddle for plotOptions.series.dataLabels, formatting all points
Fiddle for series.data.dataLabels, formatting specific point
So, since you're formatting yAxis, {value} should work as expected:
yAxis: {
labels: {
format: '{value:,.0f} €'
}
}

If you find the above solution not working, try to add this:
Highcharts.setOptions({
lang: {
thousandsSep: ','
}
});

Code to format with comma
var UNDEFINED;
Highcharts.chart(...
...
yAxis: {
labels: {
formatter: function () {
return Highcharts.numberFormat(this.value, -1, UNDEFINED, ',');
}
}
}

Label the JQplot pie chart

I am using JQplot Pie Chart. I need the labels to appear outside the chart. How can I make that possible?

If you mean data labels then you need to set the dataLabelPositionFactor to appropriate value greater than 1.0 and you are done.
Example sample available here.

To do that yuo need to specify the placement propertie :
legend: {
show:true; placement: "outsideGrid"
}
Example :
$.jqplot('YOUR_DIV_ID', [['LABEL_1',2],['LABEL_2',232],['LABEL_3',22], {
seriesDefaults: {
// Make this a pie chart.
renderer: jQuery.jqplot.PieRenderer,
rendererOptions: {
// Put data labels on the pie slices.
// By default, labels show the percentage of the slice.
showDataLabels: true
}
},
//Make legend visibile, outside the chart
legend: {
show:true, placement: "outsideGrid"
}
}
);

How to show the values on the regions of the jqplot chart instead of percentage

I have javascript code as:
var plot1 = jQuery.jqplot ('chartdiv', [data],
{
seriesDefaults: {
// Make this a pie chart.
renderer: jQuery.jqplot.PieRenderer,
rendererOptions: {
// Put data labels on the pie slices.
// By default, labels show the percentage of the slice.
showDataLabels: true,
dataLabels: 'value'
}
},
legend: { show:true, location:'e'}
});
var handler = function(ev, gridpos, datapos, neighbor, plot) {
if (neighbor) {
alert('x:' + neighbor.data[0] + ' y:' + neighbor.data[1]);
}
};
$.jqplot.eventListenerHooks.push(['jqplotClick', handler]);
Now by using dataLabels: 'value' I am able to show values but shown value is 51 instead of 50.667.Value is rounded.But I need to show exact value.How to this??
My second question is that When I have mouse pointer on any region of the chart I want to show something.Is that would be done using jqplotDataMouseOver But how to use it?

Your first question can be solved with the dataLabelFormatString property:
seriesDefaults: {
// Make this a pie chart.
renderer: jQuery.jqplot.PieRenderer,
rendererOptions: {
// Put data labels on the pie slices.
// By default, labels show the percentage of the slice.
showDataLabels: true,
dataLabels: 'value',
dataLabelFormatString:'%.4f'
}
},
The '%.4f' would show 4 decimal places.
Your second question is more difficult. Apparently events on bar charts are not quite ironed out with jqplot. But the last suggestion in that link works for me:
$('#chartdiv').bind('jqplotDataMouseOver', function (ev, seriesIndex, pointIndex, data) { alert('series: '+seriesIndex+', point: '+pointIndex+', data: '+data)});
Here's a jsfiddle, remember to cache the JS files since jqplot does not allow hotlinking.