Support SVG Opacity Correctly

0 votes
asked May 10, 2021 in Bug by bcholmes (120 points)
edited May 10, 2021 by bcholmes

I asked this question in a comment to a similar bug, but since that bug has been answered, I speculate that the comment is unlikely to be noticed.

The problem I'm dealing with relates to using RGBA colours (with alpha transparency) as the background colour of shapes. When I output that to SVG, I get SVG elements that look something like this:

<p fill="#FFFFFF00" ...>

Unfortunately, although Firefox will render this in a way that looks correct, Chrome and Inkscape will not (instead showing a black background), because SVG expects the transparency part of the colour to be specified in a fill-opacity attribute. The underlying implementation of that behaviour is specified in net.sourceforge.plantuml.svg.SvgGraphics -- the fillMe() method has some special handling for transparent black, but other transparency isn't covered. Can you tweak that method something like this:

private void fillMe(Element elt) {
  if (fill.equals("#00000000") == false) {
    double opacity = getOpacity(fill);
    String fillWithoutOpacity = colourWithoutOpacity(fill);
    elt.setAttribute("fill", fillWithoutOpacity);
    if (opacity < 1.0) {
      elt.setAttribute("fill-opacity", String.format("%,.5f", opacity));
    }
  }
}

private String colourWithoutOpacity(String colour) {
  if (colour.matches("#[0-9A-Fa-f]{8}")) {
    return colour.substring(0, 7);
  } else {
    return colour;
  }
}

private double getOpacity(String colour) {
  if (colour.matches("#[0-9A-Fa-f]{8}")) {
    return Integer.parseInt(colour.substring(7), 16) / 255.0;
  } else {
    return 1.0;
  }
}

commented May 10, 2021 by The-Lu (64,760 points)

Hello all,

Perhaps link or not to this another related issue:

Regards,
Th.

1 Answer

0 votes
answered May 14, 2021 by plantuml (295,000 points)
selected May 14, 2021 by bcholmes
 
Best answer
Thanks for the feedback.

This should be fixed in last release V1.2021.6

Tell us if you find other issues !
...