Skip to main content

On Sale: GamesAssetsToolsTabletopComics
Indie game storeFree gamesFun gamesHorror games
Game developmentAssetsComics
SalesBundles
Jobs
TagsGame Engines

[bug] exported svg files is not rendered properly in firefox

A topic by ch1p2 created Jun 23, 2022 Views: 309 Replies: 6
Viewing posts 1 to 4

the svg files seem messy in the firefox browser (and any firefox based browsers such as iceraven or tor browser) while it is correctly rendered when opened with chromium based browsers.

this issue occurs in both the latest pro version and the latest nightly version of mannequin.

this issue does not occur in the free version (since it is not possible to export svg files using the free version)


Developer

Thank you very much for the information! Definitely did not expect that Firefox would render it differently. Will check it out and make adjustments ASAP.

(1 edit)

the scarf also seems glitchy (in chromium)

it should not be transparent

Developer


Done implementing the fixes. Will update the nightly builds shortly.

Developer

The fixes should be live now in the latest nightly builds. Feel free to let us know if there's still problems!

i have looked into the svg files and found it might be the transform attribute of the svg tags that causes this bug. chromium based browsers ignore it while firefox does not.

however, batch export the svg files is really time consuming, so i have written a javascript to repair the already exported files by removing 'transform' from svg tags.

// repairsvg.js
((cheerio, fs) => {
    let repair = path => fs.readFile(path, 'utf8', (err, data) => err ? console.log(err) : ($ => {
        $('svg').each((i, element) => $(element).attr('transform', null));
        fs.writeFile(path + '.repaired.svg', $.html(), 'utf8', err => err ? console.log(err) : null);
    })(cheerio.load(data, {
        xmlMode: true
    })));
    fs.readFile(process.argv[2], 'utf8', (err, data) => err ? console.log(err) : (data => 
        data.split('\0').forEach(path => repair(path))
    )(data));
})(require('cheerio'), require('fs'));

save the script above as 'repairsvg.js' and put it into the directory where you exported svg files to

% pushd /path/to/svg/files
% yarn add cheerio
% find -L -name '*svg' -print0 > ./list.txt
% node ./repairsvg.js ./list.txt

now wait for a few seconds and the svg files will be repaired (this takes much less time than exporting the svg files again)

Developer

Yes, that is correct and indeed the fix that is implemented in the latest build is removing the transform tag. Thank you for sharing your script!