Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

'clipPathUnits' svg attribute is getting converted to 'clip-pathunits'

See original GitHub issue

Input:

<svg>
  <clipPath id="hexagon" clipPathUnits="objectBoundingBox">
    <polygon points="0.5 0, 1 0.25, 1 0.75, 0.5 1, 0 0.75, 0 0.25" />
  </clipPath>
</svg>

output:

<svg>
  <clipPath id="hexagon" clip-pathunits="objectBoundingBox">
    <polygon points="0.5 0, 1 0.25, 1 0.75, 0.5 1, 0 0.75, 0 0.25" />
  </clipPath>
</svg>

Issue Analytics

State:
Created 4 years ago
Reactions:1
Comments:5 (4 by maintainers)

Top GitHub Comments

2reactions

marvinhagemeistercommented, Feb 11, 2020

This was fixed with #2251 and it was released as part of 10.3.1 🎉

1reaction

marvinhagemeistercommented, Mar 10, 2020

@moklick Can you file a new issue for that? Comments on closed issues quickly get lost in GitHub’s ui, which makes it pretty hard for us to track work.

Top Results From Across the Web

clipPathUnits - SVG: Scalable Vector Graphics - MDN Web Docs

The clipPathUnits attribute indicates which coordinate system to use for the contents of the element.

How to use SVG clipPathUnits="objectBoundingBox"

Open this svg file in text editor and copy the value of d attribute. Now you have your complex path in relative coordinates....

14 Clipping, Masking and Compositing - W3C

SVG supports the following clipping/masking features: ... If attribute clipPathUnits is not specified, then the effect is as if a value of userSpaceOnUse ......

Scaling SVG Clipping Paths for CSS Use - meyerweb.com

First, add the clipPathUnits attribute to the <clipPath> element: <svg version="1.1" xmlns="http://www.w3.org/2000/svg" ...

TypedSvg.Attributes - typed-svg 1.1.0 - Elm Packages

The clipPathUnits attribute defines the coordinate system for the ... to the value of the colorInterpolation attribute on the element being animated.