SvgToDataUri

1. SvgToDataUri

• How to transform an SVG into a data URI (opens new window)

export const svgToDataUri = (svg: string) => {
  const encodeSvg = svg
    .replace('<svg', ~svg.indexOf('xmlns') ? '<svg' : '<svg xmlns="http://www.w3.org/2000/svg"')
    .replace(/"/g, "'")
    .replace(/%/g, '%25')
    .replace(/#/g, '%23')
    .replace(/{/g, '%7B')
    .replace(/}/g, '%7D')
    .replace(/</g, '%3C')
    .replace(/>/g, '%3E')
    .replace(/\s+/g, ' ')

  return `data:image/svg+xml;utf8,${encodeSvg(svg)}`
}