CODEWITHSUNDEEP
jquerycsscanvasjqplot
0xburned
0xburned

Reputation: 2655

how to I remove canvas white background from jqPlot metergauge chart

I have been looking at the core CSS and JS library of jqplot, but I couldn't find a way to remove the white background from Canvas element (Meter gauge).

Here is the the Fiddle LINK

enter image description here

HTML

<div id="chart4" class="plot" style="width:500px;height:300px;"></div>

JS

$(document).ready(function(){
         s1 = [3];

         plot4 = $.jqplot('chart4',[s1],{
             seriesDefaults: {
                 renderer: $.jqplot.MeterGaugeRenderer,
                 rendererOptions: {
                     min: 0.0,
                     max: 5.0,
                     label: '3.5',
                     labelPosition: 'inside',
                     labelHeightAdjust: -8,
                     intervalOuterRadius: 70,
                     ticks: [0, 1, 2, 3, 4, 5],
                     intervals:[3, 4, 5],
                     intervalColors:['#d9534f', '#5bc0de', '#5cb85c'],
                     background: "#3498db",
                     ringColor: "#154172",
                     tickColor: "989898"
                 }
             }
         });
      });

Upvotes: 0

Views: 1633

Answers (1)

AnthonyLeGovic
AnthonyLeGovic

Reputation: 2335

You have an option called grid (see documentation here), where you can set all the grid parameters - especially background in your case :

grid: {
 background: 'transparent' 
}

Please see a working example here

Upvotes: 1

Related Questions