diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
| commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
| tree | f435a8308119effd964b339f76abb83a57c29483 /testing/web-platform/tests/svg/painting/reftests | |
| parent | Initial commit. (diff) | |
| download | firefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz firefox-26a029d407be480d791972afb5975cf62c9360a6.zip | |
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/svg/painting/reftests')
41 files changed, 1950 insertions, 0 deletions
diff --git a/testing/web-platform/tests/svg/painting/reftests/display-none-mask-ref.html b/testing/web-platform/tests/svg/painting/reftests/display-none-mask-ref.html new file mode 100644 index 0000000000..3739265b23 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/display-none-mask-ref.html @@ -0,0 +1,50 @@ +<!DOCTYPE html> +<html lang="en"> + +<head> + <meta charset="UTF-8"> +</head> + +<body> + <svg width="200" height="200"> + <foreignObject x="0" y="0" width="200" height="200"> + <div style="width: 200px; height: 200px;"></div> + </foreignObject> + </svg> + <svg width="200" height="200"> + <foreignObject x="0" y="0" width="200" height="200"> + <div style="width: 200px; height: 200px; background: green"></div> + </foreignObject> + </svg> + <svg width="200" height="200"> + <foreignObject x="0" y="0" width="200" height="200"> + <div style="width: 200px; height: 200px;"></div> + </foreignObject> + </svg> + <svg width="200" height="200"> + <foreignObject x="0" y="0" width="200" height="200"> + <div style="width: 200px; height: 200px; background: green"></div> + </foreignObject> + </svg> + + <!-- make sure masking actually works --> + <svg width="200" height="200"> + <rect x="0" y="0" width="100" height="50" fill="green"></rect> + <rect x="0" y="100" width="100" height="50" fill="green"></rect> + </svg> + <svg width="200" height="200"> + <rect x="0" y="0" width="100" height="50" fill="green"></rect> + <rect x="0" y="100" width="100" height="50" fill="green"></rect> + </svg> + + <!-- make sure masking works on active content --> + <svg width="200" height="200"> + <rect x="0" y="0" width="100" height="50" fill="green"></rect> + <rect x="0" y="100" width="100" height="50" fill="green"></rect> + </svg> + <svg width="200" height="200"> + <rect x="0" y="0" width="100" height="50" fill="green"></rect> + <rect x="0" y="100" width="100" height="50" fill="green"></rect> + </svg> +</body> +</html> diff --git a/testing/web-platform/tests/svg/painting/reftests/display-none-mask.html b/testing/web-platform/tests/svg/painting/reftests/display-none-mask.html new file mode 100644 index 0000000000..a6aa600757 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/display-none-mask.html @@ -0,0 +1,80 @@ +<!DOCTYPE html> +<html lang="en"> + +<head> + <meta charset="UTF-8"> + <title>Mask behaviour when mask image is missing or display:none</title> + <link rel="match" href="display-none-mask-ref.html"> + <link name="author" title="Timothy Nikkel" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1624532"> + <link name="author" title="Mike Bremford" href="http://bfo.com"> <!-- edited 202010 --> + <link rel="help" href="https://drafts.fxtf.org/css-masking-1/#the-mask-image"> + <link rel="help" href="https://drafts.fxtf.org/css-masking-1/#MaskElement"> + <link rel="help" href="https://github.com/w3c/fxtf-drafts/issues/245"> + <meta name="assert" content="A missing or invalid mask image is equivalent to transparent black (i.e. nothing is displayed). A mask with display:none is disabled (which is a change to the specified behaviour as of issue 245)"> +</head> + +<body> + <svg width="200" height="200"> + <!-- missing/invalid mask is equivalent to transparent black - nothing displayed --> + <foreignObject x="0" y="0" width="200" height="200" style="mask: url('#notfound');"> + <div style="width: 200px; height: 200px; background: red"></div> + </foreignObject> + </svg> + <svg width="200" height="200"> + <!-- display:none on mask means mask is not applied (new in https://github.com/w3c/fxtf-drafts/issues/245) --> + <foreignObject x="0" y="0" width="200" height="200" style="mask: url('#noneMask');"> + <div style="width: 200px; height: 200px; background: green"></div> + </foreignObject> + </svg> + <svg width="200" height="200"> + <foreignObject x="0" y="0" width="200" height="200"> + <!-- missing/invalid mask is equivalent to transparent black - nothing displayed --> + <div style="width: 200px; height: 200px; background: red; mask: url('#notfound');"></div> + </foreignObject> + </svg> + <svg width="200" height="200"> + <foreignObject x="0" y="0" width="200" height="200"> + <!-- display:none on mask means mask is not applied (new in https://github.com/w3c/fxtf-drafts/issues/245) --> + <div style="width: 200px; height: 200px; background: green; mask: url('#noneMask');"></div> + </foreignObject> + </svg> + + <svg width="200" height="200" style="display:none"> + <defs> + <mask id="noneMask"> + <rect x="0" y="0" width="200" height="200" fill="#4d4d4d"></rect> + </mask> + </defs> + </svg> + + <!-- make sure masking actually works --> + <svg width="200" height="200"> + <defs> + <mask id="aMask"> + <rect x="0" y="0" width="100" height="50" fill="#ffffff"></rect> + <rect x="0" y="100" width="100" height="50" fill="#ffffff"></rect> + </mask> + </defs> + <foreignObject x="0" y="0" width="200" height="200" style="mask: url('#aMask');"> + <div style="width: 200px; height: 200px; background: green;"></div> + </foreignObject> + </svg> + <svg width="200" height="200"> + <foreignObject x="0" y="0" width="200" height="200"> + <div style="width: 200px; height: 200px; background: green; mask: url('#aMask');"></div> + </foreignObject> + </svg> + + <!-- make sure masking works on active content --> + <svg width="200" height="200"> + <foreignObject x="0" y="0" width="200" height="200" style="mask: url('#aMask');"> + <div style="width: 200px; height: 200px; background: green; will-change: transform"></div> + </foreignObject> + </svg> + <svg width="200" height="200"> + <foreignObject x="0" y="0" width="200" height="200"> + <div style="width: 200px; height: 200px; background: green; will-change: transform; mask: url('#aMask');"></div> + </foreignObject> + </svg> +</body> +</html> diff --git a/testing/web-platform/tests/svg/painting/reftests/fallback-001.svg b/testing/web-platform/tests/svg/painting/reftests/fallback-001.svg new file mode 100644 index 0000000000..e2788e5f93 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/fallback-001.svg @@ -0,0 +1,6 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:h="http://www.w3.org/1999/xhtml"> + <title>SVG paint server: without fallback color nothing is painted</title> + <h:link rel="match" href="../../pservers/reftests/reference/green-100x100.svg"/> + <rect width="100" height="100" fill="green"/> + <rect width="100" height="100" fill="url(#null)"/> +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/fallback-002.svg b/testing/web-platform/tests/svg/painting/reftests/fallback-002.svg new file mode 100644 index 0000000000..6180cb2a96 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/fallback-002.svg @@ -0,0 +1,5 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:h="http://www.w3.org/1999/xhtml"> + <title>SVG paint server: paint fallback color</title> + <h:link rel="match" href="../../pservers/reftests/reference/green-100x100.svg"/> + <rect width="100" height="100" fill="url(#null) green"/> +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-implicit-subpaths.html b/testing/web-platform/tests/svg/painting/reftests/marker-implicit-subpaths.html new file mode 100644 index 0000000000..7f87ae05e6 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-implicit-subpaths.html @@ -0,0 +1,12 @@ +<!doctype html> +<title>Marker on implicit subpath</title> +<link rel="help" href="https://svgwg.org/svg2-draft/painting.html#RenderingMarkers"> +<link rel="help" href="https://svgwg.org/svg2-draft/paths.html#PathDataClosePathCommand"> +<link rel="match" href="../../struct/reftests/reference/green-100x100.html"> +<svg width="400" viewBox="-200 0 400 150"> + <marker id="m" markerUnits="userSpaceOnUse" orient="auto" overflow="visible"> + <rect width="100" height="100" fill="green"/> + </marker> + <rect x="-200" width="100" height="100" fill="red"/> + <path d="M-200,0ZZZ" marker-mid="url(#m)" stroke="red" stroke-width="4"/> +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-001-ref.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-001-ref.svg new file mode 100644 index 0000000000..202ac3420d --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-001-ref.svg @@ -0,0 +1,94 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Path (Linear).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="10" + markerHeight="10" + orient="auto" + overflow="visible" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="10" + markerHeight="10" + orient="auto" + overflow="visible" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="10" + markerHeight="10" + orient="auto" + overflow="visible" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + + <path id="PStart" transform="matrix(2,0,0,2,0,-10)" d="M 0 0 L 10 5 L 0 10 z" fill="green"/> + <path id="PMid" transform="matrix(2,0,0,2,0,-10)" d="M 0 0 L 10 5 L 0 10 z" fill="orange"/> + <path id="PEnd" transform="matrix(2,0,0,2,0,-10)" d="M 0 0 L 10 5 L 0 10 z" fill="blue"/> + </defs> + + <g id="test-body-reference" style="fill:none;stroke:black;stroke-width:2"> + <path d="m 50,120 50,0 50,0 50,0"/> + <path d="m 50,140 50,20 50,-20 50,20"/> + + <path d="m 50,200 l 50,0 l 50,0 l 50,0"/> + <path d="m 50,220 l 50,20 l 50,-20 l 50,20"/> + + <path d="m 50,280 h 50 v 50 h 50"/> + + <path d="M 290,120 340,120 390,120 440,120"/> + <path d="M 290,140 340,160 390,140 440,160"/> + + <path d="M 290,200 L 340,200 L 390,200 L 440,200"/> + <path d="M 290,220 L 340,240 L 390,220 L 440,240"/> + + <path d="M 290,280 H 340 V 330 H 390"/> + + <g id="ref" style="stroke:none"> + <g id="linear"> + <use xlink:href="#PStart" transform="translate(50,120)"/> + <use xlink:href="#PMid" transform="translate(100,120)"/> + <use xlink:href="#PMid" transform="translate(150,120)"/> + <use xlink:href="#PEnd" transform="translate(200,120)"/> + </g> + <g id="zigzag"> + <path d="m 50,140 50,20" style="marker-start:url(#Start)"/> + <path d="m 50,160 50,0 50,0" style="marker-mid:url(#Mid)"/> + <path d="m 100,140 50,0 50,0" style="marker-mid:url(#Mid)"/> + <path d="m 150,140 50,20" style="marker-end:url(#End)"/> + </g> + <g id="step"> + <path d="m 50,280 50,0" style="marker-start:url(#Start)"/> + <path d="m 50,230 50,50 50,50" style="marker-mid:url(#Mid)"/> + <path d="m 50,280 50,50 50,50" style="marker-mid:url(#Mid)"/> + <path d="m 100,330 50,0" style="marker-end:url(#End)"/> + </g> + + <use xlink:href="#linear" transform="translate(0,80)"/> + <use xlink:href="#zigzag" transform="translate(0,80)"/> + </g> + + <use xlink:href="#ref" transform="translate(240,0)"/> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-001.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-001.svg new file mode 100644 index 0000000000..75bc5703b7 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-001.svg @@ -0,0 +1,68 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Path (Linear).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + <html:link rel="help" + href="https://www.w3.org/TR/SVG2/painting.html#Markers"/> + <html:link rel="match" href="marker-path-001-ref.svg" /> + <html:meta name="fuzzy" content="0-8;0-8"/> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="10" + markerHeight="10" + orient="auto" + overflow="visible" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="10" + markerHeight="10" + orient="auto" + overflow="visible" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="10" + markerHeight="10" + orient="auto" + overflow="visible" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-content" style="fill:none;stroke:black;stroke-width:2;marker-start:url(#Start);marker-mid:url(#Mid);marker-end:url(#End)"> + <path d="m 50,120 50,0 50,0 50,0"/> + <path d="m 50,140 50,20 50,-20 50,20"/> + + <path d="m 50,200 l 50,0 l 50,0 l 50,0"/> + <path d="m 50,220 l 50,20 l 50,-20 l 50,20"/> + + <path d="m 50,280 h 50 v 50 h 50"/> + + <path d="M 290,120 340,120 390,120 440,120"/> + <path d="M 290,140 340,160 390,140 440,160"/> + + <path d="M 290,200 L 340,200 L 390,200 L 440,200"/> + <path d="M 290,220 L 340,240 L 390,220 L 440,240"/> + + <path d="M 290,280 H 340 V 330 H 390"/> +</g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-002-ref.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-002-ref.svg new file mode 100644 index 0000000000..c9ee76915b --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-002-ref.svg @@ -0,0 +1,78 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Path (Bezier).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-reference" style="fill:none;stroke:black;stroke-width:2"> + <path d="m 50,120 c 20,20 30,-20 50,0 c 20,20 30,-20 50,0 c 20,20 30,-20 50,0"/> + <path d="m 50,150 c 20,20 30,-20 50,0 s 30,-20 50,0 s 30,-20 50,0"/> + + <path d="m 50,240 q 25,25 50,0 q 25,-25 50,0 q 25,25 50,0"/> + <path d="m 50,270 q 25,25 50,0 t 50,0 t 50,0"/> + + <path d="M 290,120 C 310,140 320,100, 340,120 C 360,140 370,100 390,120 C 410,140 420,100 440,120"/> + <path d="M 290,150 C 310,170 320,130, 340,150 S 370,130 390,150 S 420,130 440,150"/> + + <path d="M 290,240 Q 315,265 340,240 Q 365,215 390,240 Q 415,265 440,240"/> + <path d="M 290,270 Q 315,295 340,270 T 390,270 T 440,270"/> + + <g id="cubic"> + <path d="m 50,120 20,20" style="stroke:none;marker-start:url(#Start)"/> + <path d="m 100,120 20,20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 150,120 20,20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,120 20,20" style="stroke:none;marker-start:url(#End)"/> + </g> + <use xlink:href="#cubic" transform="translate(240, 0)"/> + <use xlink:href="#cubic" transform="translate( 0, 30)"/> + <use xlink:href="#cubic" transform="translate(240, 30)"/> + + <g id="quadratic"> + <path d="m 50,240 20, 20" style="stroke:none;marker-start:url(#Start)"/> + <path d="m 100,240 20,-20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 150,240 20, 20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,240 20,-20" style="stroke:none;marker-start:url(#End)"/> + </g> + <use xlink:href="#quadratic" transform="translate(240, 0)"/> + <use xlink:href="#quadratic" transform="translate( 0, 30)"/> + <use xlink:href="#quadratic" transform="translate(240, 30)"/> + + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-002.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-002.svg new file mode 100644 index 0000000000..7467c7d523 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-002.svg @@ -0,0 +1,60 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Path (Bezier).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + <html:link rel="help" + href="https://www.w3.org/TR/SVG2/painting.html#Markers"/> + <html:link rel="match" href="marker-path-002-ref.svg" /> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-content" style="fill:none;stroke:black;stroke-width:2;marker-start:url(#Start);marker-mid:url(#Mid);marker-end:url(#End)"> + <path d="m 50,120 c 20,20 30,-20 50,0 c 20,20 30,-20 50,0 c 20,20 30,-20 50,0"/> + <path d="m 50,150 c 20,20 30,-20 50,0 s 30,-20 50,0 s 30,-20 50,0"/> + + <path d="m 50,240 q 25,25 50,0 q 25,-25 50,0 q 25,25 50,0"/> + <path d="m 50,270 q 25,25 50,0 t 50,0 t 50,0"/> + + <path d="M 290,120 C 310,140 320,100, 340,120 C 360,140 370,100 390,120 C 410,140 420,100 440,120"/> + <path d="M 290,150 C 310,170 320,130, 340,150 S 370,130 390,150 S 420,130 440,150"/> + + <path d="M 290,240 Q 315,265 340,240 Q 365,215 390,240 Q 415,265 440,240"/> + <path d="M 290,270 Q 315,295 340,270 T 390,270 T 440,270"/> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-003-ref.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-003-ref.svg new file mode 100644 index 0000000000..3ba459c700 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-003-ref.svg @@ -0,0 +1,70 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Path (Arc).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-reference" style="fill:none;stroke:black;stroke-width:2"> + <path d="m 50,120 a 30,20 90 0 0 50,0 a 30,20 90 0 1 50,0 a 30,20 90 0 0 50,0"/> + + <path d="m 50,240 a 30,20 90 0 1 50,0 a 30,20 90 0 0 50,0 a 30,20 90 0 1 50,0"/> + + <path d="M 290,120 A 30,20 90 0 0 340,120 A 30,20 90 0 1 390,120 A 30,20 90 0 0 440,120"/> + + <path d="M 290,240 A 30,20 90 0 1 340,240 A 30,20 90 0 0 390,240 A 30,20 90 0 1 440,240"/> + + <g id="down"> + <path d="m 50,120 0, 20" style="stroke:none;marker-start:url(#Start)"/> + <path d="m 100,120 0,-20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 150,120 0, 20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,120 0,-20" style="stroke:none;marker-start:url(#End)"/> + </g> + <use xlink:href="#down" transform="translate(240, 0)"/> + + <g id="up"> + <path d="m 50,240 0,-20" style="stroke:none;marker-start:url(#Start)"/> + <path d="m 100,240 0, 20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 150,240 0,-20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,240 0, 20" style="stroke:none;marker-start:url(#End)"/> + </g> + <use xlink:href="#up" transform="translate(240, 0)"/> + + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-003.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-003.svg new file mode 100644 index 0000000000..a31bf84e52 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-003.svg @@ -0,0 +1,56 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Path (Arc).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + <html:link rel="help" + href="https://www.w3.org/TR/SVG2/painting.html#Markers"/> + <html:link rel="match" href="marker-path-003-ref.svg" /> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-content" style="fill:none;stroke:black;stroke-width:2;marker-start:url(#Start);marker-mid:url(#Mid);marker-end:url(#End)"> + <path d="m 50,120 a 30,20 90 0 0 50,0 a 30,20 90 0 1 50,0 a 30,20 90 0 0 50,0"/> + + <path d="m 50,240 a 30,20 90 0 1 50,0 a 30,20 90 0 0 50,0 a 30,20 90 0 1 50,0"/> + + <path d="M 290,120 A 30,20 90 0 0 340,120 A 30,20 90 0 1 390,120 A 30,20 90 0 0 440,120"/> + + <path d="M 290,240 A 30,20 90 0 1 340,240 A 30,20 90 0 0 390,240 A 30,20 90 0 1 440,240"/> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-011-ref.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-011-ref.svg new file mode 100644 index 0000000000..4d6cc76054 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-011-ref.svg @@ -0,0 +1,83 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Sub-Path (Linear).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-reference" style="fill:none;stroke:black;stroke-width:2"> + <path d="m 50,120 50,0 m 50,0 50,0"/> + <path d="m 50,140 50,20 m 50,-20 50,20"/> + + <path d="m 50,200 l 50,0 m 50,0 l 50,0"/> + <path d="m 50,220 l 50,20 m 50,-20 l 50,20"/> + + <path d="m 50,280 h 50 m 0,50 h 50"/> + + <path d="M 290,120 340,120 M 390,120 440,120"/> + <path d="M 290,140 340,160 M 390,140 440,160"/> + + <path d="M 290,200 L 340,200 M 390,200 L 440,200"/> + <path d="M 290,220 L 340,240 M 390,220 L 440,240"/> + + <path d="M 290,280 H 340 M 340,330 H 390"/> + + <g id="linear"> + <path d="m 50,120 50,0" style="stroke:none;marker-start:url(#Start);marker-end:url(#Mid)"/> + <path d="m 150,120 50,0" style="stroke:none;marker-start:url(#Mid); marker-end:url(#End)"/> + </g> + <use xlink:href="#linear" transform="translate(240, 0)"/> + <use xlink:href="#linear" transform="translate( 0, 80)"/> + <use xlink:href="#linear" transform="translate(240, 80)"/> + + <g id="zigzag"> + <path d="m 50,140 50,20" style="stroke:none;marker-start:url(#Start);marker-end:url(#Mid)"/> + <path d="m 150,140 50,20" style="stroke:none;marker-start:url(#Mid); marker-end:url(#End)"/> + </g> + <use xlink:href="#zigzag" transform="translate(240, 0)"/> + <use xlink:href="#zigzag" transform="translate( 0, 80)"/> + <use xlink:href="#zigzag" transform="translate(240, 80)"/> + + <g id="step"> + <path d="m 50,280 50,0" style="stroke:none;marker-start:url(#Start);marker-end:url(#Mid)"/> + <path d="m 100,330 50,0" style="stroke:none;marker-start:url(#Mid); marker-end:url(#End)"/> + </g> + <use xlink:href="#step" transform="translate(240, 0)"/> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-011.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-011.svg new file mode 100644 index 0000000000..b6627f86e8 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-011.svg @@ -0,0 +1,64 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Sub-Path (Linear).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + <html:link rel="help" + href="https://www.w3.org/TR/SVG2/painting.html#Markers"/> + <html:link rel="match" href="marker-path-011-ref.svg" /> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-content" style="fill:none;stroke:black;stroke-width:2;marker-start:url(#Start);marker-mid:url(#Mid);marker-end:url(#End)"> + <path d="m 50,120 50,0 m 50,0 50,0"/> + <path d="m 50,140 50,20 m 50,-20 50,20"/> + + <path d="m 50,200 l 50,0 m 50,0 l 50,0"/> + <path d="m 50,220 l 50,20 m 50,-20 l 50,20"/> + + <path d="m 50,280 h 50 m 0,50 h 50"/> + + <path d="M 290,120 340,120 M 390,120 440,120"/> + <path d="M 290,140 340,160 M 390,140 440,160"/> + + <path d="M 290,200 L 340,200 M 390,200 L 440,200"/> + <path d="M 290,220 L 340,240 M 390,220 L 440,240"/> + + <path d="M 290,280 H 340 M 340,330 H 390"/> +</g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-012-ref.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-012-ref.svg new file mode 100644 index 0000000000..ad44874cda --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-012-ref.svg @@ -0,0 +1,70 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Sub-Path (Bezier).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-reference" style="fill:none;stroke:black;stroke-width:2"> + <path d="m 50,120 c 20,20 30,-20 50,0 m 50,0 c 20,20 30,-20 50,0"/> + + <path d="m 50,240 q 25,25 50,0 m 50,0 q 25,25 50,0"/> + + <path d="M 290,120 C 310,140 320,100, 340,120 M 390,120 C 410,140 420,100 440,120"/> + + <path d="M 290,240 Q 315,265 340,240 M 390,240 Q 415,265 440,240"/> + + <g id="cubic"> + <path d="m 50,120 20,20" style="stroke:none;marker-start:url(#Start)"/> + <path d="m 100,120 20,20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 150,120 20,20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,120 20,20" style="stroke:none;marker-start:url(#End)"/> + </g> + <use xlink:href="#cubic" transform="translate(240, 0)"/> + + <g id="quadratic"> + <path d="m 50,240 20, 20" style="stroke:none;marker-start:url(#Start)"/> + <path d="m 100,240 20,-20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 150,240 20, 20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,240 20,-20" style="stroke:none;marker-start:url(#End)"/> + </g> + <use xlink:href="#quadratic" transform="translate(240, 0)"/> + + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-012.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-012.svg new file mode 100644 index 0000000000..1586951b1f --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-012.svg @@ -0,0 +1,56 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Sub-Path (Bezier).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + <html:link rel="help" + href="https://www.w3.org/TR/SVG2/painting.html#Markers"/> + <html:link rel="match" href="marker-path-012-ref.svg" /> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-content" style="fill:none;stroke:black;stroke-width:2;marker-start:url(#Start);marker-mid:url(#Mid);marker-end:url(#End)"> + <path d="m 50,120 c 20,20 30,-20 50,0 m 50,0 c 20,20 30,-20 50,0"/> + + <path d="m 50,240 q 25,25 50,0 m 50,0 q 25,25 50,0"/> + + <path d="M 290,120 C 310,140 320,100, 340,120 M 390,120 C 410,140 420,100 440,120"/> + + <path d="M 290,240 Q 315,265 340,240 M 390,240 Q 415,265 440,240"/> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-013-ref.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-013-ref.svg new file mode 100644 index 0000000000..e03fc4827e --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-013-ref.svg @@ -0,0 +1,70 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Sub-Path (Arc).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-reference" style="fill:none;stroke:black;stroke-width:2"> + <path d="m 50,120 a 30,20 90 0 0 50,0 m 50,0 a 30,20 90 0 0 50,0"/> + + <path d="m 50,240 a 30,20 90 0 1 50,0 m 50,0 a 30,20 90 0 1 50,0"/> + + <path d="M 290,120 A 30,20 90 0 0 340,120 M 390,120 A 30,20 90 0 0 440,120"/> + + <path d="M 290,240 A 30,20 90 0 1 340,240 M 390,240 A 30,20 90 0 1 440,240"/> + + <g id="down"> + <path d="m 50,120 0, 20" style="stroke:none;marker-start:url(#Start)"/> + <path d="m 100,120 0,-20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 150,120 0, 20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,120 0,-20" style="stroke:none;marker-start:url(#End)"/> + </g> + <use xlink:href="#down" transform="translate(240, 0)"/> + + <g id="up"> + <path d="m 50,240 0,-20" style="stroke:none;marker-start:url(#Start)"/> + <path d="m 100,240 0, 20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 150,240 0,-20" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,240 0, 20" style="stroke:none;marker-start:url(#End)"/> + </g> + <use xlink:href="#up" transform="translate(240, 0)"/> + + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-013.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-013.svg new file mode 100644 index 0000000000..e7a44351fa --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-013.svg @@ -0,0 +1,56 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Sub-Path (Arc).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + <html:link rel="help" + href="https://www.w3.org/TR/SVG2/painting.html#Markers"/> + <html:link rel="match" href="marker-path-013-ref.svg" /> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-content" style="fill:none;stroke:black;stroke-width:2;marker-start:url(#Start);marker-mid:url(#Mid);marker-end:url(#End)"> + <path d="m 50,120 a 30,20 90 0 0 50,0 m 50,0 a 30,20 90 0 0 50,0"/> + + <path d="m 50,240 a 30,20 90 0 1 50,0 m 50,0 a 30,20 90 0 1 50,0"/> + + <path d="M 290,120 A 30,20 90 0 0 340,120 M 390,120 A 30,20 90 0 0 440,120"/> + + <path d="M 290,240 A 30,20 90 0 1 340,240 M 390,240 A 30,20 90 0 1 440,240"/> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-021-ref.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-021-ref.svg new file mode 100644 index 0000000000..b452ca7325 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-021-ref.svg @@ -0,0 +1,75 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Closed Sub-Path (Linear).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-reference" style="fill:none;stroke:black;stroke-width:2"> + <path d="m 120,100 -40,40 40,40 40,-40 z" /> + <path d="m 240,100 -40,40 40,40 40,-40 z" /> + <path d="m 360,100 -40,40 40,40 40,-40 z" /> + + <path d="m 60,200 -40,40 40,40 40,-40 z m 60,60 -40,40 40,40 40,-40 z" /> + <path d="m 200,200 -40,40 40,40 40,-40 z m 60,60 -40,40 40,40 40,-40 z" /> + <path d="m 340,200 -40,40 40,40 40,-40 z m 60,60 -40,40 40,40 40,-40 z" /> + + <!-- Arrows --> + <path d="m 120,100 -40, 0" style="stroke:none;marker-start:url(#Start)"/> + <path d="m 200,140 0, 40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 240,180 40, 0" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 280,140 0,-40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 360,100 -40, 0" style="stroke:none;marker-start:url(#End)"/> + + <path d="m 60,200 -40, 0" style="stroke:none;marker-start:url(#Start)"/> + + <path d="m 160,240 0, 40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,280 40, 0" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 240,240 0,-40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,200 -40, 0" style="stroke:none;marker-start:url(#Mid)"/> + + <path d="m 220,300 0, 40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 260,340 40, 0" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 300,300 0,-40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 260,260 -40, 0" style="stroke:none;marker-start:url(#Mid)"/> + + <path d="m 400,260 -40, 0" style="stroke:none;marker-start:url(#End)"/> + + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-021.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-021.svg new file mode 100644 index 0000000000..db4bc629e2 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-021.svg @@ -0,0 +1,56 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Closed Sub-Path (Linear).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + <html:link rel="help" + href="https://www.w3.org/TR/SVG2/painting.html#Markers"/> + <html:link rel="match" href="marker-path-021-ref.svg" /> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-content" style="fill:none;stroke:black;stroke-width:2"> + <path d="m 120,100 -40,40 40,40 40,-40 z" style="marker-start:url(#Start)"/> + <path d="m 240,100 -40,40 40,40 40,-40 z" style="marker-mid:url(#Mid)" /> + <path d="m 360,100 -40,40 40,40 40,-40 z" style="marker-end:url(#End)" /> + + <path d="m 60,200 -40,40 40,40 40,-40 z m 60,60 -40,40 40,40 40,-40 z" style="marker-start:url(#Start)"/> + <path d="m 200,200 -40,40 40,40 40,-40 z m 60,60 -40,40 40,40 40,-40 z" style="marker-mid:url(#Mid)" /> + <path d="m 340,200 -40,40 40,40 40,-40 z m 60,60 -40,40 40,40 40,-40 z" style="marker-end:url(#End)" /> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-022-ref.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-022-ref.svg new file mode 100644 index 0000000000..8abf33f088 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-022-ref.svg @@ -0,0 +1,75 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Closed Sub-Path (Bezier).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-reference" style="fill:none;stroke:black;stroke-width:2"> + <path d="m 120,100 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z"/> + <path d="m 240,100 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z"/> + <path d="m 360,100 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z"/> + + <path d="m 60,200 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z m 60,60 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z"/> + <path d="m 200,200 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z m 60,60 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z"/> + <path d="m 340,200 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z m 60,60 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z"/> + + <!-- Arrows --> + <path d="m 120,100 -40, 0" style="stroke:none;marker-start:url(#Start)"/> + <path d="m 200,140 0, 40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 240,180 40, 0" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 280,140 0,-40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 360,100 -40, 0" style="stroke:none;marker-start:url(#End)"/> + + <path d="m 60,200 -40, 0" style="stroke:none;marker-start:url(#Start)"/> + + <path d="m 160,240 0, 40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,280 40, 0" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 240,240 0,-40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,200 -40, 0" style="stroke:none;marker-start:url(#Mid)"/> + + <path d="m 220,300 0, 40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 260,340 40, 0" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 300,300 0,-40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 260,260 -40, 0" style="stroke:none;marker-start:url(#Mid)"/> + + <path d="m 400,260 -40, 0" style="stroke:none;marker-start:url(#End)"/> + + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-022.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-022.svg new file mode 100644 index 0000000000..6a2345ab47 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-022.svg @@ -0,0 +1,56 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Closed Sub-Path (Bezier).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + <html:link rel="help" + href="https://www.w3.org/TR/SVG2/painting.html#Markers"/> + <html:link rel="match" href="marker-path-022-ref.svg" /> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-content" style="fill:none;stroke:black;stroke-width:2"> + <path d="m 120,100 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z" style="marker-start:url(#Start)"/> + <path d="m 240,100 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z" style="marker-mid:url(#Mid)"/> + <path d="m 360,100 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z" style="marker-end:url(#End)"/> + + <path d="m 60,200 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z m 60,60 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z" style="marker-start:url(#Start)"/> + <path d="m 200,200 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z m 60,60 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z" style="marker-mid:url(#Mid)"/> + <path d="m 340,200 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z m 60,60 c -40,0 -40,0 -40,40 c 0,40 0,40 40,40 c 40,0 40,0 40,-40 c 0,-40 0,-40 -40,-40 z" style="marker-end:url(#End)"/> +</g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-023-ref.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-023-ref.svg new file mode 100644 index 0000000000..4bd1c67776 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-023-ref.svg @@ -0,0 +1,75 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Closed Sub-Path (Arc).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-reference" style="fill:none;stroke:black;stroke-width:2"> + <path d="m 120,100 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z"/> + <path d="m 240,100 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z"/> + <path d="m 360,100 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z"/> + + <path d="m 60,200 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z m 60,60 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z"/> + <path d="m 200,200 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z m 60,60 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z"/> + <path d="m 340,200 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z m 60,60 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z"/> + + <!-- Arrows --> + <path d="m 120,100 -40, 0" style="stroke:none;marker-start:url(#Start)"/> + <path d="m 200,140 0, 40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 240,180 40, 0" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 280,140 0,-40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 360,100 -40, 0" style="stroke:none;marker-start:url(#End)"/> + + <path d="m 60,200 -40, 0" style="stroke:none;marker-start:url(#Start)"/> + + <path d="m 160,240 0, 40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,280 40, 0" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 240,240 0,-40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 200,200 -40, 0" style="stroke:none;marker-start:url(#Mid)"/> + + <path d="m 220,300 0, 40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 260,340 40, 0" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 300,300 0,-40" style="stroke:none;marker-start:url(#Mid)"/> + <path d="m 260,260 -40, 0" style="stroke:none;marker-start:url(#Mid)"/> + + <path d="m 400,260 -40, 0" style="stroke:none;marker-start:url(#End)"/> + + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-path-023.svg b/testing/web-platform/tests/svg/painting/reftests/marker-path-023.svg new file mode 100644 index 0000000000..56fe216e2f --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-path-023.svg @@ -0,0 +1,58 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Markers on Closed Sub-Path (Arc).</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + <html:link rel="help" + href="https://www.w3.org/TR/SVG2/painting.html#Markers"/> + <html:link rel="match" href="marker-path-023-ref.svg" /> + </g> + + <defs> + <marker id="Start" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="green"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="Mid" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="orange"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + <marker id="End" + viewBox="0 0 10 10" refX="0" refY="5" + markerUnits="strokeWidth" + markerWidth="12" + markerHeight="9" + orient="auto" + fill="blue"> + <path d="M 0 0 L 10 5 L 0 10 z"/> + </marker> + </defs> + + <g id="test-body-content" style="fill:none;stroke:black;stroke-width:2"> + + <path d="m 120,100 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z" style="marker-start:url(#Start)"/> + <path d="m 240,100 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z" style="marker-mid:url(#Mid)"/> + <path d="m 360,100 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z" style="marker-end:url(#End)"/> + + <path d="m 60,200 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z m 60,60 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z" style="marker-start:url(#Start)"/> + <path d="m 200,200 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z m 60,60 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z" style="marker-mid:url(#Mid)"/> + <path d="m 340,200 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z m 60,60 a 40,40 0 0 0 -40,40 a 40,40 0 0 0 40,40 a 40,40 0 0 0 40,-40 a 40,40 0 0 0 -40,-40 z" style="marker-end:url(#End)"/> + + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-units-strokewidth-non-scaling-stroke.svg b/testing/web-platform/tests/svg/painting/reftests/marker-units-strokewidth-non-scaling-stroke.svg new file mode 100644 index 0000000000..116c61c45e --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-units-strokewidth-non-scaling-stroke.svg @@ -0,0 +1,13 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:h="http://www.w3.org/1999/xhtml"> + <title>Markers: markerUnits=strokeWidth with vector-effect=non-scaling-stroke</title> + <h:link rel="help" href="https://svgwg.org/svg2-draft/painting.html#MarkerUnitsAttribute"/> + <h:link rel="match" href="../../embedded/reference/green-rect-100x100.svg"/> + + <marker id="m" orient="0" refY="5" markerUnits="strokeWidth" + markerWidth="10" markerHeight="10"> + <rect width="10" height="10" fill="green"/> + </marker> + <line x2="10" y1="5" y2="5" vector-effect="non-scaling-stroke" + stroke="red" stroke-width="10" marker-start="url(#m)" + transform="scale(10)"/> +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-units-userspaceonuse-non-scaling-stroke.svg b/testing/web-platform/tests/svg/painting/reftests/marker-units-userspaceonuse-non-scaling-stroke.svg new file mode 100644 index 0000000000..7c4c5e0fcf --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/marker-units-userspaceonuse-non-scaling-stroke.svg @@ -0,0 +1,13 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:h="http://www.w3.org/1999/xhtml"> + <title>Markers: markerUnits=userSpaceOnUse with vector-effect=non-scaling-stroke</title> + <h:link rel="help" href="https://svgwg.org/svg2-draft/painting.html#MarkerUnitsAttribute"/> + <h:link rel="match" href="../../embedded/reference/green-rect-100x100.svg"/> + + <marker id="m" orient="0" refY="5" markerUnits="userSpaceOnUse" + markerWidth="10" markerHeight="10"> + <rect width="10" height="10" fill="green"/> + </marker> + <line x2="10" y1="5" y2="5" vector-effect="non-scaling-stroke" + stroke="red" stroke-width="10" marker-start="url(#m)" + transform="scale(10)"/> +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/markers-orient-001-ref.svg b/testing/web-platform/tests/svg/painting/reftests/markers-orient-001-ref.svg new file mode 100644 index 0000000000..871003f3a2 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/markers-orient-001-ref.svg @@ -0,0 +1,48 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Marker: 'orient'</title> + </g> + + <style id="test-font" type="text/css"> + /* Standard Font (if needed). */ + @font-face { + font-family: FreeSans; + src: url("../fonts/FreeSans.woff") format("woff"); + } + text { + font-family: FreeSans, sans-serif; + text-anchor: middle; + fill: black; + } + #title { + font-size: 24px; + } + .label { + font-size: 18px; + } + </style> + + <defs> + <path id="triangle" d="m 0,0 0,-2.5 10,2.5 -10,2.5 z"/> + </defs> + + <g id="test-body-reference" style="fill:black"> + <path d="m 120,120 120,0 120,0" style="stroke:black;stroke-width:4px"/> + <path d="m 120,220 120,0 120,0" style="stroke:black;stroke-width:4px"/> + <path d="m 120,320 120,0 120,0" style="stroke:black;stroke-width:4px"/> + <use xlink:href="#triangle" transform="translate(120,120) scale(4,4)"/> + <use xlink:href="#triangle" transform="translate(240,120) scale(4,4)"/> + <use xlink:href="#triangle" transform="translate(360,120) scale(4,4)"/> + <use xlink:href="#triangle" transform="translate(120,220) scale(4,4) rotate(45)"/> + <use xlink:href="#triangle" transform="translate(240,220) scale(4,4) rotate(45)"/> + <use xlink:href="#triangle" transform="translate(360,220) scale(4,4) rotate(45)"/> + <use xlink:href="#triangle" transform="translate(120,320) scale(4,4) rotate(180)"/> + <use xlink:href="#triangle" transform="translate(240,320) scale(4,4)"/> + <use xlink:href="#triangle" transform="translate(360,320) scale(4,4)"/> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/markers-orient-001.svg b/testing/web-platform/tests/svg/painting/reftests/markers-orient-001.svg new file mode 100644 index 0000000000..190423f988 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/markers-orient-001.svg @@ -0,0 +1,68 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Marker: 'orient'</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + <html:link rel="help" + href="https://www.w3.org/TR/SVG2/painting.html#OrientAttribute"/> + <html:link rel="match" href="markers-orient-001-ref.svg" /> + </g> + + <style id="test-font" type="text/css"> + /* Standard Font (if needed). */ + @font-face { + font-family: FreeSans; + src: url("../fonts/FreeSans.woff") format("woff"); + } + text { + font-family: FreeSans, sans-serif; + text-anchor: middle; + fill: black; + } + #title { + font-size: 24px; + } + .label { + font-size: 18px; + } + #reference { + display: none; + } + </style> + + <defs> + <path id="triangle" d="m 0,0 0,-2.5 10,2.5 -10,2.5 z"/> + <marker id="OrientAuto" style="overflow:visible" markerWidth="5" markerHeight="10"> + <use xlink:href="#triangle"/> + </marker> + <marker id="OrientFixed" style="overflow:visible" markerWidth="5" markerHeight="10" orient="45"> + <use xlink:href="#triangle"/> + </marker> + <marker id="OrientAutoReverse" style="overflow:visible" markerWidth="5" markerHeight="10" orient="auto-start-reverse"> + <use xlink:href="#triangle"/> + </marker> + </defs> + + <g id="reference" style="fill:red"> + <use xlink:href="#triangle" transform="translate(120,120) scale(4,4)"/> + <use xlink:href="#triangle" transform="translate(240,120) scale(4,4)"/> + <use xlink:href="#triangle" transform="translate(360,120) scale(4,4)"/> + <use xlink:href="#triangle" transform="translate(120,220) scale(4,4) rotate(45)"/> + <use xlink:href="#triangle" transform="translate(240,220) scale(4,4) rotate(45)"/> + <use xlink:href="#triangle" transform="translate(360,220) scale(4,4) rotate(45)"/> + <use xlink:href="#triangle" transform="translate(120,320) scale(4,4) rotate(180)"/> + <use xlink:href="#triangle" transform="translate(240,320) scale(4,4)"/> + <use xlink:href="#triangle" transform="translate(360,320) scale(4,4)"/> + </g> + <g id="test-body-content" font-size="16"> + <path d="m 120,120 120,0 120,0" style="stroke:black;stroke-width:4px;marker:url(#OrientAuto)"/> + <path d="m 120,220 120,0 120,0" style="stroke:black;stroke-width:4px;marker:url(#OrientFixed)"/> + <path d="m 120,320 120,0 120,0" style="stroke:black;stroke-width:4px;marker:url(#OrientAutoReverse)"/> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/markers-orient-002.svg b/testing/web-platform/tests/svg/painting/reftests/markers-orient-002.svg new file mode 100644 index 0000000000..f371784e2a --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/markers-orient-002.svg @@ -0,0 +1,15 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:h="http://www.w3.org/1999/xhtml"> + <title>orient='auto' with 180 degree turns</title> + <h:link rel="help" href="https://svgwg.org/svg2-draft/painting.html#RenderingMarkers"/> + <h:link rel="match" href="../../pservers/reftests/reference/green-100x100.svg"/> + <marker id="m" markerWidth="100" markerHeight="50" markerUnits="userSpaceOnUse" + orient="auto" refX="50" refY="50"> + <path d="M50,-5L105,50h-110z" fill="green"/> + </marker> + <g marker-start="url(#m)"> + <path d="M50,0v50z"/> + <path d="M100,50h-50z"/> + <path d="M50,100v-50z"/> + <path d="M0,50h50z"/> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/mask-percentage-ref.html b/testing/web-platform/tests/svg/painting/reftests/mask-percentage-ref.html new file mode 100644 index 0000000000..00c26e85cc --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/mask-percentage-ref.html @@ -0,0 +1,10 @@ +<!DOCTYPE html> +<html> +<body> +<svg + width="100%" height="100%" + xmlns="http://www.w3.org/2000/svg"> + <rect x="0" y="0" width="100%" height="100%" fill='lime'></rect> +</svg> +</body> +</html> diff --git a/testing/web-platform/tests/svg/painting/reftests/mask-percentage.html b/testing/web-platform/tests/svg/painting/reftests/mask-percentage.html new file mode 100644 index 0000000000..e9cd097741 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/mask-percentage.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<title>Percentages in a mask</title> +<link rel="help" href="https://crbug.com/1500476" /> +<link rel="match" href="mask-percentage-ref.html" /> +<body> +<svg + width="100%" height="100%" + xmlns="http://www.w3.org/2000/svg"> + + <defs> + <mask id='corner'> + <g><rect x="0" y="0" height="100%" width="100%" fill="white" /></g> + </mask> + </defs> + + <rect x="0" y="0" width="100%" height="100%" fill="red"></rect> + <g mask='url(#corner)'> + <rect x="0" y="0" width="100%" height="100%" fill='lime'></rect> + </g> +</svg> +</body> +</html> diff --git a/testing/web-platform/tests/svg/painting/reftests/mask-print-ref.svg b/testing/web-platform/tests/svg/painting/reftests/mask-print-ref.svg new file mode 100644 index 0000000000..4717ac4a27 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/mask-print-ref.svg @@ -0,0 +1,6 @@ +<svg width="200" height="200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> +<rect x="0" y="0" width="200" height="200" fill="green" /> +<rect x="0" y="0" width="100" height="200" fill="red"/> +<rect x="90" y="0" width="20" height="200" fill="black" /> +<rect x="0" y="0" width="200" height="4" fill="black" /> +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/mask-print.svg b/testing/web-platform/tests/svg/painting/reftests/mask-print.svg new file mode 100644 index 0000000000..b63ec72054 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/mask-print.svg @@ -0,0 +1,15 @@ +<svg width="200" height="200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" +xmlns:html="http://www.w3.org/1999/xhtml"> +<html:meta name="fuzzy" content="0-1;0-17280" /> +<html:link rel="match" href="mask-print-ref.svg" /> +<defs> +<mask id="Mask"> +<rect x="0" y="0" width="100" height="200" fill="white" /> +</mask> +</defs> + +<rect x="0" y="0" width="200" height="200" fill="green" /> +<rect x="0" y="0" width="200" height="200" fill="red" mask="url(#Mask)" /> +<rect x="90" y="0" width="20" height="200" fill="black" /> +<rect x="0" y="0" width="200" height="4" fill="black" /> +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/paint-context-001-ref.svg b/testing/web-platform/tests/svg/painting/reftests/paint-context-001-ref.svg new file mode 100644 index 0000000000..99bd8c44cb --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/paint-context-001-ref.svg @@ -0,0 +1,44 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Paint: 'paint-order'</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + </g> + + <style id="test-font" type="text/css"> + /* Standard Font (if needed). */ + @font-face { + font-family: FreeSans; + src: url("../fonts/FreeSans.woff") format("woff"); + } + text { + font-family: FreeSans, sans-serif; + text-anchor: middle; + fill: black; + } + #title { + font-size: 24px; + } + .label { + font-size: 18px; + } + </style> + + <defs> + <rect id="rectangle" width="2" height="2" style="fill:lime;stroke:blue" /> + <marker id="marker" style="overflow:visible" markerWidth="2" markerHeight="2" orient="auto" viewBox="0 0 2 2" refX="1" refY="1"> + <use xlink:href="#rectangle"/> + </marker> + <path id="path" d="m -25,-25 0,50 50,0 0,-50 z"/> + </defs> + + <g id="test-reference" font-size="16" style="fill:blue;stroke:lime;stroke-width:15px;marker:url(#marker)"> + <path d="m 120,220 c 120,120 120,-120 240,0"/> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/paint-context-001.svg b/testing/web-platform/tests/svg/painting/reftests/paint-context-001.svg new file mode 100644 index 0000000000..fd58d9b790 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/paint-context-001.svg @@ -0,0 +1,47 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Paint: 'context-fill' and 'context-stroke'</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + <html:link rel="help" + href="https://www.w3.org/TR/SVG2/painting.html#SpecifyingPaint"/> + <html:link rel="match" href="paint-context-001-ref.svg" /> + </g> + + <style id="test-font" type="text/css"> + /* Standard Font (if needed). */ + @font-face { + font-family: FreeSans; + src: url("../fonts/FreeSans.woff") format("woff"); + } + text { + font-family: FreeSans, sans-serif; + text-anchor: middle; + fill: black; + } + #title { + font-size: 24px; + } + .label { + font-size: 18px; + } + </style> + + <defs> + <rect id="rectangle" width="2" height="2" style="fill:context-stroke;stroke:context-fill" /> + <marker id="marker" style="overflow:visible" markerWidth="2" markerHeight="2" orient="auto" viewBox="0 0 2 2" refX="1" refY="1"> + <use xlink:href="#rectangle"/> + </marker> + <path id="path" d="m -25,-25 0,50 50,0 0,-50 z"/> + </defs> + + <g id="test-body-content" font-size="16" style="fill:blue;stroke:lime;stroke-width:15px;marker:url(#marker)"> + <path d="m 120,220 c 120,120 120,-120 240,0"/> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/paint-context-002-ref.svg b/testing/web-platform/tests/svg/painting/reftests/paint-context-002-ref.svg new file mode 100644 index 0000000000..446e8e3fca --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/paint-context-002-ref.svg @@ -0,0 +1,41 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Paint: 'paint-order'</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + </g> + + <style id="test-font" type="text/css"> + /* Standard Font (if needed). */ + @font-face { + font-family: FreeSans; + src: url("../fonts/FreeSans.woff") format("woff"); + } + text { + font-family: FreeSans, sans-serif; + text-anchor: middle; + fill: black; + } + #title { + font-size: 24px; + } + .label { + font-size: 18px; + } + </style> + + <defs> + <rect id="rectangle" width="120" height="120" /> + </defs> + + <g id="test-reference" font-size="16" style="fill:lime;stroke:blue;stroke-width:15px"> + <use xlink:href="#rectangle" transform="translate(60,120)"/> + <use xlink:href="#rectangle" transform="translate(300,120)" style="fill:lightblue;stroke:green"/> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/paint-context-002.svg b/testing/web-platform/tests/svg/painting/reftests/paint-context-002.svg new file mode 100644 index 0000000000..8a8a378488 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/paint-context-002.svg @@ -0,0 +1,44 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Paint: 'context-fill' and 'context-stroke'</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + <html:link rel="help" + href="https://www.w3.org/TR/SVG2/painting.html#SpecifyingPaint"/> + <html:link rel="match" href="paint-context-002-ref.svg" /> + </g> + + <style id="test-font" type="text/css"> + /* Standard Font (if needed). */ + @font-face { + font-family: FreeSans; + src: url("../fonts/FreeSans.woff") format("woff"); + } + text { + font-family: FreeSans, sans-serif; + text-anchor: middle; + fill: black; + } + #title { + font-size: 24px; + } + .label { + font-size: 18px; + } + </style> + + <defs> + <rect id="rectangle" width="120" height="120" style="fill:context-stroke;stroke:context-fill" /> + </defs> + + <g id="test-body-content" font-size="16" style="fill:blue;stroke:lime;stroke-width:15px"> + <use xlink:href="#rectangle" transform="translate(60,120)"/> + <use xlink:href="#rectangle" transform="translate(300,120)" style="fill:green;stroke:lightblue"/> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/paint-order-001-ref.svg b/testing/web-platform/tests/svg/painting/reftests/paint-order-001-ref.svg new file mode 100644 index 0000000000..7822a80b94 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/paint-order-001-ref.svg @@ -0,0 +1,74 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Paint: 'paint-order'</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + </g> + + <style id="test-font" type="text/css"> + /* Standard Font (if needed). */ + @font-face { + font-family: FreeSans; + src: url("../fonts/FreeSans.woff") format("woff"); + } + text { + font-family: FreeSans, sans-serif; + text-anchor: middle; + fill: black; + } + #title { + font-size: 24px; + } + .label { + font-size: 18px; + } + </style> + + <defs> + <rect id="rectangle" width="2" height="2" style="fill:blue" /> + <marker id="marker" style="overflow:visible" markerWidth="2" markerHeight="2" orient="auto" viewBox="0 0 2 2" refX="1" refY="1"> + <use xlink:href="#rectangle"/> + </marker> + <path id="path" d="m -25,-25 0,50 50,0 0,-50 z"/> + </defs> + + <g id="test-reference" font-size="16" style="fill:lavender;stroke:green;stroke-width:5px;marker:url(#marker)"> + <g transform="translate(120,120)"> + <use xlink:href="#path"/> + </g> + <g transform="translate(240,120)"> + <use xlink:href="#path"/> + </g> + <g transform="translate(360,120)"> + <use xlink:href="#path"/> + </g> + <g transform="translate(120,220)"> + <use xlink:href="#path"/> + </g> + <g transform="translate(240,220)"> + <use xlink:href="#path" style="marker:none"/> + <use xlink:href="#path" style="stroke:none"/> + </g> + <g transform="translate(360,220)"> + <use xlink:href="#path" style="stroke:none"/> + <use xlink:href="#path" style="marker:none"/> + </g> + <g transform="translate(120,320)"> + <use xlink:href="#path"/> + </g> + <g transform="translate(240,320)"> + <use xlink:href="#path"/> + <use xlink:href="#path" style="stroke:none;marker:none"/> + </g> + <g transform="translate(360,320)"> + <use xlink:href="#path" style="stroke:none"/> + <use xlink:href="#path" style="marker:none"/> + </g> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/paint-order-001.svg b/testing/web-platform/tests/svg/painting/reftests/paint-order-001.svg new file mode 100644 index 0000000000..c8d60bd5bf --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/paint-order-001.svg @@ -0,0 +1,55 @@ +<svg id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <g id="testmeta"> + <title>Paint: 'paint-order'</title> + <html:link rel="author" + title="Tavmjong Bah" + href="http://tavmjong.free.fr"/> + <html:link rel="help" + href="https://www.w3.org/TR/SVG2/painting.html#PaintOrder"/> + <html:link rel="match" href="paint-order-001-ref.svg" /> + </g> + + <style id="test-font" type="text/css"> + /* Standard Font (if needed). */ + @font-face { + font-family: FreeSans; + src: url("../fonts/FreeSans.woff") format("woff"); + } + text { + font-family: FreeSans, sans-serif; + text-anchor: middle; + fill: black; + } + #title { + font-size: 24px; + } + .label { + font-size: 18px; + } + </style> + + <defs> + <rect id="rectangle" width="2" height="2" style="fill:blue" /> + <marker id="marker" style="overflow:visible" markerWidth="2" markerHeight="2" orient="auto" viewBox="0 0 2 2" refX="1" refY="1"> + <use xlink:href="#rectangle"/> + </marker> + <path id="path" d="m -25,-25 0,50 50,0 0,-50 z"/> + </defs> + + <g id="test-body-content" font-size="16" style="fill:lavender;stroke:green;stroke-width:5px;marker:url(#marker)"> + <use xlink:href="#path" transform="translate(120,120)" style="" /> + <use xlink:href="#path" transform="translate(240,120)" style="paint-order:normal" /> + <use xlink:href="#path" transform="translate(360,120)" style="paint-order:fill stroke markers" /> + <use xlink:href="#path" transform="translate(120,220)" style="paint-order:fill" /> + <use xlink:href="#path" transform="translate(240,220)" style="paint-order:stroke" /> + <use xlink:href="#path" transform="translate(360,220)" style="paint-order:markers" /> + <use xlink:href="#path" transform="translate(120,320)" style="paint-order:fill stroke" /> + <use xlink:href="#path" transform="translate(240,320)" style="paint-order:stroke markers" /> + <use xlink:href="#path" transform="translate(360,320)" style="paint-order:markers fill" /> + </g> + +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/percentage-attribute.svg b/testing/web-platform/tests/svg/painting/reftests/percentage-attribute.svg new file mode 100644 index 0000000000..d245999db0 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/percentage-attribute.svg @@ -0,0 +1,20 @@ +<?xml version="1.0" encoding="utf-8"?> +<svg id="svg-root" + width="310" height="170" viewBox="0, 0, 620, 340" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Percentages in stroke dimensions</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="percentage-ref.svg" /> + + <style> + rect { + fill: none; + stroke: blue; + } + </style> + + <rect x="62" y="68" width="434" height="204" + stroke-width="10%" stroke-dasharray="20% 30%" stroke-dashoffset="-10%" /> +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/percentage-ref.svg b/testing/web-platform/tests/svg/painting/reftests/percentage-ref.svg new file mode 100644 index 0000000000..610a3ddb2d --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/percentage-ref.svg @@ -0,0 +1,19 @@ +<?xml version="1.0" encoding="utf-8"?> +<svg id="svg-root" + width="310" height="170" viewBox="0, 0, 620, 340" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + + <style> + rect { + fill: none; + stroke: blue; + stroke-width: 50px; + stroke-dasharray: 100px 150px; + stroke-dashoffset: -50px; + } + </style> + + <rect x="62" y="68" width="434" height="204" /> +</svg> diff --git a/testing/web-platform/tests/svg/painting/reftests/percentage.svg b/testing/web-platform/tests/svg/painting/reftests/percentage.svg new file mode 100644 index 0000000000..640c1eb450 --- /dev/null +++ b/testing/web-platform/tests/svg/painting/reftests/percentage.svg @@ -0,0 +1,22 @@ +<?xml version="1.0" encoding="utf-8"?> +<svg id="svg-root" + width="310" height="170" viewBox="0, 0, 620, 340" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Percentages in stroke dimensions</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/geometry.html"/> + <html:link rel="match" href="percentage-ref.svg" /> + + <style> + rect { + fill: none; + stroke: blue; + stroke-width: 10%; + stroke-dasharray: 20% 30%; + stroke-dashoffset: -10%; + } + </style> + + <rect x="62" y="68" width="434" height="204" /> +</svg> |
