-
Notifications
You must be signed in to change notification settings - Fork 2
Attributes support
This document provides an overview of all SVG elements (as listed at https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute) and whether they are supported by this project. If the section for an attribute is empty, it is currently unknown whether the element is supported.
- If an attribute is supported on all elements it may be used on, the section will just say ":heavy_check_mark: Full support".
- If an attribute is not supported on any element, the section will just say ":x: Not supported".
- Some attributes might not be supported on all possible elements or they only accept a subset of all possible values. In this case, you will see a table like
spreadMethod
pad |
All other values | |
---|---|---|
<linearGradient> |
✔️ Supported | ❌ Not supported |
All other elements | ❌ Not supported | ❌ Not supported |
Please note: This table only is an example for support tables. To find out the actual support for the spreadMethod
-attribute, please take a look at its section.
❌ Not supportedhttps://github.com/hpi-swa-teaching/SVGMorph.wiki.git
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
length | percentage | |
---|---|---|
<circle> |
Partial support (see 1.) | ❌ Not supported |
<ellipse> |
Partial support (see 1.) | ❌ Not supported |
<radialGradient> |
❌ Not supported | ✔️ Full support |
See cx
.
M | m | L | l | H | h | V | v | C | c | S | s | Q | q | T | t | A | a | Z | z | |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
<path> |
Supported | Supported | Not Supported (see 2.) | Not Supported (see 2.) | Not Supported (see 2.) | Not Supported (see 2.) | Not Supported (see 2.) | Not Supported (see 2.) | Partial support (see 1.) | Partial support(see 1.) | Partial support (see 1.) | Partial support (see 1.) | Not Supported (see 2.) | Not Supported (see 2.) | Not Supported (see 2.) | Not Supported (see 2.) | Partial support (see 3.) | Partial support (see 3.) | Not supported | Not supported |
- All segments are translated to morph objects, but just the first of them is rendered.
- Renderer expects segments to have 4 control points (see Bezier based rendering), but lines just have 2 control points.
- Large arcs are split into multiple bezier curves (e.g. 4) but just the first is rendered. Might relate to (1.)
❌ Not supported
❌ Not supported
❌ Not supported
none |
inherit |
inline |
All other values | |
---|---|---|---|---|
<g> , <svg>
|
Partial support (see 1.) | Partial support (see 2.) | ✔️ Full support | Partial support (see 2.) |
All other elements | ❌ Not supported | Partial support (see 2.) | ✔️ Full support | Partial support (see 2.) |
- Elements with
display
set tonone
should not be part of the rendering tree and should therefore not be taken into account when computing bounds. This is currently not implemented. Nevertheless, there is currently no feature that relies on the bounds of<g>
s or<svg>
s. - At the moment,
inherit
is treated like any value butnone
, so the element will be displayed. However, children of elements withdisplay
set tonone
should never be displayed, so the wrong interpretation does not cause any visible issues. On export,inherit
will be exported correctly. - Will be displayed like
inline
which should be fine in most cases. No special features like grids are supported.
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
freeze , remove
|
currentcolor |
none |
Reference to gradient | Reference to pattern |
context-fill , context-stroke
|
Color keywords (e.g. lime ) |
Three digit hex (e.g. #0f0 ) |
Six digit hex (e.g. #0f0 ) |
RGB (e.g. rgb(0, 255, 0) ) |
RGB percentages (e.g. rgb(0%, 100%, 0%) ) |
RGBA (e.g. rgb(0, 255, 0, 0.5) ) |
RGBA percentages (e.g. rgb(0%, 100%, 0%, 0.5) ) |
transparent |
HSL and HSLA | |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
<circle> , <ellipse>
|
Not allowed on this elements | ❌ Not supported (see 1.) | Partial support (see 3.) | Partial support (see 4.) | ❌ Not supported (see 5.) | ❌ Not supported | Partial support (see 6.) | Not supported | ✔️ Full support | ✔️ Full support | ✔️ Full support | Partial support (see 7.) | Partial support (see 7.) | ✔️ Full support | ❌ Not supported |
<path> , <polygon> , <polyline> , <rect> , <text> , <tspan>
|
Not allowed on this elements | ❌ Not supported (see 1.) | Partial support (see 3.) | ✔️ Full support | ❌ Not supported (see 5.) | ❌ Not supported | Partial support (see 6.) | Not supported | ✔️ Full support | ✔️ Full support | ✔️ Full support | Partial support (see 7.) | Partial support (see 7.) | ✔️ Full support | ❌ Not supported |
<animate> , <animateColor> , <animateMotion> , <animateTransform> , <set>
|
❌ Not supported (see 2.) | ❌ Not supported (see 1., 2.) | ❌ Not supported (see 2.) | ❌ Not supported (see 2.) | ❌ Not supported (see 2., 5.) | ❌ Not supported (see 2.) | ❌ Not supported (see 2.) | ❌ Not supported (see 2.) | ❌ Not supported (see 2.) | ❌ Not supported (see 2.) | ❌ Not supported (see 2.) | ❌ Not supported (see 2.) | ❌ Not supported (see 2.) | ❌ Not supported (see 2.) | ❌ Not supported (see 2.) |
- As the
color
attribute is not supported yet,currentcolor
cannot be used - At the moment, there is no support for animations. Therefore, the respective elements and attribute values cannot be used.
- A fill of
none
will be displayed correctly, but in the export, it will show up as transparent fill (#00000000
) which might cause some issues. - The gradient will only be rendered correctly if the
<circle>
or<element>
has its upper left corner at(0, 0)
in the morphic world. - Since
<pattern>
s are not supported yet, they cannot be referenced. - Color keywords will only be recognized in lowercase, while the color names should be case-insensitive according to the specification.
- The aplha value will be ignored. This violates the specification, which states that a user agent must ignore unknown properties and must never support certain values partially.
✔️ Full support
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
✔️ Full support
- The validity of IDs is not validated. Therefore, invalid IDs may be exported if the original document contained invalid IDs. Invalid IDs include the same ID for multiple elements or IDs with invalid characters.
- Although IDs can be specified and will be parsed for every element, they might not be usable for every purpose, like referencing clip paths. Please refer to the documentation of the attribute you want to supply with IDs of other elements.
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
Partial support.
For strokes, this property is only taken into account if the stroke
property is set for the same element.
The opacity won't overridde inherited strokes.
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
length | percentage | |
---|---|---|
<circle> |
Partially supported (see 1.) | ❌ Not supported |
<radialGradient> |
❔ Unknown | ❔ Unknown |
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
auto |
length | percentage | |
---|---|---|---|
<ellipse> |
❌ Not supported | Partial support (see 1.) | ❌ Not supported |
<rect> |
❌ Not supported | ❌ Not supported | ❌ Not supported |
See rx
.
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
currentcolor |
none |
Reference to gradient | Reference to pattern |
context-fill , context-stroke
|
Color keywords (e.g. lime ) |
Three digit hex (e.g. #0f0 ) |
Six digit hex (e.g. #0f0 ) |
RGB (e.g. rgb(0, 255, 0) ) |
RGB percentages (e.g. rgb(0%, 100%, 0%) ) |
RGBA (e.g. rgb(0, 255, 0, 0.5) ) |
RGBA percentages (e.g. rgb(0%, 100%, 0%, 0.5) ) |
transparent |
HSL and HSLA | |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
<circle> , <ellipse>
|
❌ Not supported (see 1.) | Partial support (see 2.) | Partial support (see 3.) | ❌ Not supported (see 4.) | ❌ Not supported | Partial support (see 5.) | Not supported | ✔️ Full support | ✔️ Full support | ✔️ Full support | Partial support (see 6.) | Partial support (see 6.) | ✔️ Full support | ❌ Not supported |
<path> , <polygon> , <polyline> , <rect>
|
❌ Not supported (see 1.) | Partial support (see 2.) | ✔️ Full support | ❌ Not supported (see 4.) | ❌ Not supported | Partial support (see 5.) | Not supported | ✔️ Full support | ✔️ Full support | ✔️ Full support | Partial support (see 6.) | Partial support (see 6.) | ✔️ Full support | ❌ Not supported |
<text> , <tspan>
|
❌ Not supported (see 7.) | ❌ Not supported (see 7.) | ❌ Not supported (see 7.) | ❌ Not supported (see 7.) | ❌ Not supported (see 7.) | ❌ Not supported (see 7.) | ❌ Not supported (see 7.) | ❌ Not supported (see 7.) | ❌ Not supported (see 7.) | ❌ Not supported (see 7.) | ❌ Not supported (see 7.) | ❌ Not supported (see 7.) | ❌ Not supported (see 7.) | ❌ Not supported (see 7.) |
- As the
color
attribute is not supported yet,currentcolor
cannot be used. - A stroke of
none
will be displayed correctly, but in the export, it will show up as transparent stroke (#00000000
) which might cause some issues. - The gradient will only be rendered correctly if the
<circle>
or<element>
has its upper left corner at(0, 0)
in the morphic world. - Since
<pattern>
s are not supported yet, they cannot be referenced. - Color keywords will only be recognized in lowercase, while the color names should be case-insensitive according to the specification.
- The aplha value will be ignored. This violates the specification, which states that a user agent must ignore unknown properties and must never support certain values partially.
- Stroked characters (specified with
<text>
or<tspan>
) are not supported.
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
Partial support.
This property is only taken into account if the stroke
property is set for the same element.
The opacity of inherited strokes won't be overridden.
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
❌ Not supported
✔️ Full support
Please note: Elements with visibility
set to collapsed
or hidden
should still be taken into account when calculating positions. This does not work for <tspan>
elements and is a known bug. However, it also does not work if the visibility is set to visible
, so this bug is not related to this attribute.
❌ Not supported
❌ Not supported
length | percentage | |
---|---|---|
<rect> |
❌ Partially supported (see 1.) | ❌ Not supported |
<text> |
❌ Partially supported (see 1.) | ❌ Not supported |
<tspan> |
❌ Partially supported (see 1.) | ❌ Not supported |
All other elements | ❌ Not supported | ❌ Not supported |
❌ Not supported
❌ Not supported
❌ Not supported
See x
.
❌ Not supported
❌ Not supported