I am working with jqplot and I am trying to achieve couple of things
This is what my graph looks like
On xaxis you will notice the numbers 30 - 90 I need that to be in white and on y axis you will notice dates, i need that to be in white as well
This is what my JS looks like
var line2 = [
['1/1/2008', 42],
['2/14/2008', 56],
['3/7/2008', 39],
['4/22/2008', 81]
];
var plot2 = $.jqplot('progress_chart', [line2], {
seriesColors: [ "#F2A809"],
series:[
{
// Change our line width and use a diamond shaped marker.
lineWidth:5,
markerOptions: { style:'circle' }
}
],
grid:{
background: 'transparent', // CSS color spec for background color of grid.
borderColor: '#ffffff', // CSS color spec for border around grid.
borderWidth: 2.0 // pixel width of border around grid.
},
axes: {
xaxis: {
renderer: $.jqplot.DateAxisRenderer,
labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
tickRenderer: $.jqplot.CanvasAxisTickRenderer,
shadowAlpha : '0.1',
tickOptions: {
// labelPosition: 'middle',
angle: 15,
showGridline: false,
color: '#ffffff'
}
},
yaxis: {
label: '',
labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
tickOptions: {
showGridline: false
}
}
}
});
I will really appreciate any assistance here.
UPDATE
Thanks to @redditor answer I got it to work, however that was causing everything graph x and y axis text to turn white. This particular graph was inside another div called tab-inner-content
so I got it to work using the following CSS.
.tab-inner-content .jqplot-target {
color:#ffffff !important;
}
jqplot uses several CSS rules to create the various graph styles. It looks like the labels are controlled by the jqplot-target
class, so you need something like:
.jqplot-target {
color:#fff;
}