Make the background of a dojo chart transparent by altering SVG attributes!

The comments at the bottom of this suggest that you may do so like so:

programmersChart.surface.rawNode.childNodes[1].setAttribute('fill-opacity','0');

 
 

This put me on the right track, but I had to do a little bit more including removing a stroke around the chart. My stuff:

var pieChart = new Chart(chartNode);
pieChart.setTheme(theme);
pieChart.addPlot("default", {
   type: Pie,
   fontColor: "black"
});
pieChart.addSeries("series",chartData);
pieChart.render();
pieChart.surface.rawNode.childNodes[1].setAttribute('fill-opacity','0');
pieChart.surface.rawNode.childNodes[2].setAttribute('stroke-opacity','0');
pieChart.surface.rawNode.childNodes[3].setAttribute('fill-opacity','0');

 
 

I am using a piechart and it has the Claro theme. I don't know if that biases what must be dressed up yet. My define signature has this stuff in it:

• dojox/charting/Chart
• dojox/charting/themes/Claro
• dojox/charting/plot2d/Pie
• dojox/charting/DataChart
• dojox/charting/widget/Legend

 
 

The second, third, and fourth items I'm dressing up are rect tags. At a high level the piechart's SVG looks like this:

<svg>
   <defs>there is a bunch of stuff inside here</defs>
   <rect></rect>
   <rect></rect>
   <rect></rect>
   <g>there is a bunch of stuff inside here</g>
</svg>

 
 

Again, this is keeping it simple, the rect tags all have a bunch of attributes decorating them. I don't know why the middle one gets a border but not a background color. Whatever.