Compatibility with old SVG parsers

This function is part of icon manipulation functions in Iconify Tools.

Function deOptimisePaths() checks <path> elements for syntax that might not be supported by older software and automatically fixes it.

Unfortunately, a lot of software, such as image editing software, uses old libraries for parsing SVG. Those libraries do not support compressing arcs in paths, resulting in incorrectly imported icons. Compressing arcs doesn't make much different in icon size, so better to have icons usable in all software than save a couple of bytes.

Usage

Function has only one parameter:

• svg, SVG. Icon instance.

Function does not return anything, it applies changes to SVG instance.

Example

example.ts

tsimport { SVG, deOptimisePaths } from '@iconify/tools';

const svg = new SVG(
   '<svg viewBox="0 0 1200 400" xmlns="http://www.w3.org/2000/svg" width="1200" height="400"><path d="M300 200H150A150 150 0 10300 50z"/></svg>'
);

// Update path
deOptimisePaths(svg);

console.log(svg.toMinifiedString());

Result:

svg<svg viewBox="0 0 1200 400" xmlns="http://www.w3.org/2000/svg" width="1200" height="400"><path d="M300 200H150A150 150 0 1 0 300 50z"/></svg>

As you can see from an example, changes are minor. However, not applying these minor changes might break icon for many users that use old software, so better run this function on all icons before exporting.

Make sure you do not run SVGO optimisation after running this function because SVGO might compress paths.