howto change color on jqPlot datapoint labels

Question

I have a graph generated by jqPlot. Data Point Labels are used the show additional information on the graph, like in this example: http://www.jqplot.com/tests/point-labels.php

As you can see, the color of the data point labels is always black. But I would like to change the color of the data point labels to the same color as the graph is (by the way: I don't talk about the legend or the tick-label).

Searching trough the options page (http://www.jqplot.com/docs/files/jqPlotOptions-txt.html) I found no option to change this color.

So the question is: Is there a (other) way to change the color of the data point labels?

Thank you.

score 11 · Accepted Answer · answered Aug 11 '11 at 13:49

11

You can do that with CSS. By targeting the class .jqplot-point-label. See the example provided on the page

answered Aug 11 '11 at 13:49

dakdad

2,947
2
22
21

2

oh, i read on that part at the example page.. but yes - that's not to answer, but it points me to the right answer: Every series has his own class (which is not explained in the example). Now i changed the color by reverence an DOM element with this class: `$('.jqplot-series-'+i).css('color','#123456');` where `i` is the number of the series you like to modify. thank you – The Bndr Aug 11 '11 at 14:55

score 8 · Answer 2 · answered Mar 30 '12 at 21:12

8

In addition to the .jqplot-series-$i class, reading the source reveals that the .jqplot-data-label class is also applied to these label items.

answered Mar 30 '12 at 21:12

slypete

5,538
11
47
64

4

+1 because the pie charts use `.jqplot-data-label` and not `.jqplot-point-label` – Mechlar Mar 21 '13 at 16:32

score 1 · Answer 3 · edited Aug 30 '13 at 09:01

1

You can do this without CSS.

for series set

pointLabels:{ 
  show:true,
  escapeHTML:false
}

and

var label = '<span style="color:red">MyLabel</span>';
var seriesData = [[1,2,label], [3,4,label]];

Of course you can add a span in JavaScript loop.

edited Aug 30 '13 at 09:01

Ben

51,770
36
127
149

answered Aug 30 '13 at 08:39

mino

11
1

score 0 · Answer 4 · answered Oct 24 '14 at 07:49

0

I was using a donut chat and this is how i changed the target and label color

.jqplot-target{
     color: #ffffff !important ;

 }
.jqplot-table-legend{
    color: #666666 !important ;

}

answered Oct 24 '14 at 07:49

Shairyar

3,268
7
46
86

howto change color on jqPlot datapoint labels

4 Answers4