Processing SVG Gradient

Question

I'm having an SVG with 2 layers (back, front).
I need to fill the back with a color (the color will be random).
But the front must stay as it is.
How can I fill the back without affecting the front?

PShape elem;
PShape back;
PShape front;

void setup()
{
  size(900,600);
  background(255);
  fill(100);
  elem = loadShape("resources/images/elem.svg");
  back = elem.getChild("back");
  front = elem.getChild("front");
  smooth();
  noLoop();
}

void draw(){  
  elem.disableStyle();
  fill(0, 51, 102);
  noStroke();
  shape(back, 50, 50, 250, 250);
  shape(front, 50, 50, 250, 250);
}

Thank you for your help.

Answer 1

Hard to test for your exact setup without the svg. Still, you should be able to isolate drawing styles for parts of your shapes using pushStyle(),popStyle() pairs.

e.g.

PShape elem;
PShape back;
PShape front;

void setup()
{
  size(900,600);
  background(255);
  fill(100);
  elem = loadShape("resources/images/elem.svg");
  back = elem.getChild("back");
  front = elem.getChild("front");
  smooth();
  noLoop();
}

void draw(){  
  elem.disableStyle();
  pushStyle();
    fill(0, 51, 102);
    noStroke();
    shape(back, 50, 50, 250, 250);
  popStyle();
  pushStyle();
    shape(front, 50, 50, 250, 250);
  popStyle();
}

Indenting is just a visual cue, not actually needed.