If you are looking for the decompiler itself, visit https://github.com/jindrapetrik/jpexs-decompiler
NEW : You can now close your own issues and reopen them later if needed. You can also comment closed issues.
List of issues#2735 Automatically fix SVG conflation artifacts?
Author:
g.nassinger
g.nassingerDate created:
Type: question
Visibility: Everybody
Assigned to:
Labels: Anti-aliasSVG
State: opened 

I'm exporting shapes from a SWF file to SVG using JPEXS.
The SWF contains many DefineShape tags. After exporting to SVG, the result has conflation
artifacts (thin white gaps between adjacent shapes) when viewed in web browsers.
Example of the issue:
https://graphicdesign.stackexchange.com/questions/99156/white-space-between-objects-when-e
xporting-to-svg-in-illustrator
At first, I thought this was caused by JPEXS's SWF-to-SVG conversion. However, after
investigating, it seems the problem comes from how Flash flattens vector shapes when the
SWF is created, not from JPEXS itself.
I also found this demo, which shows that different rendering engines rasterize the same
vector data differently, and that browser renderers are among those that can produce these
artifacts:
https://w3.impa.br/~diego/projects/GanEtAl14/sample.html?contour
The workarounds I found are:
Add another path behind adjacent shapes, using the same color as one of them, to cover the
gaps. This works but is impractical because I have a large number of DefineShape objects.
Add a very small stroke (for example, 0.1px) with the same color as the fill. This hides
the gaps, but it slightly enlarges the shapes, so it is not an ideal solution.
My question is:
Is there a better way to automatically eliminate these artifacts?
One idea I had was to detect coincident edges between adjacent paths and perform boolean
operations (such as merging or extending one of the paths) so there are no visible gaps.
However, I think this would require knowing which path is in front of the other. If the
original drawing order (z-order/depth) is not preserved, the algorithm could incorrectly
cover parts of other shapes.
Does an algorithm or existing tool already solve this problem?
(by just editing the SVG, without having to patch the renderer)
I tried to fix the conflation artifacts for drawing it inside the decompiler
by multisampling - the feature can be turned on either on bitmap export ("Use advanced
MSAA renderer")
or with the grey icon under the shape preview.
Before that, I tried to experiment with enlarging shape strokes, but
it produced bad results.
I don't plan anyhow fix how SVG export behaves.
It's up to the SVG renderer how it renders the shapes.
FFDec exports shapes at precise coordinates.
There exist SVG renderers that are very good at handling conflation,
and there are others that handle it bad.
The "Massively-Parallel Vector Graphics" webpage shows the difference.
Flash uses two-sided fills with fillStyle0 and fillStyle1 on each vector,
which makes rendering it easier (for flash, not for me), SVG uses only singe side fills.
I don't think there exists any perfect way how to fix conflation on SVG without patching
the renderer.
State: new→opened
