Baseline Widely available
Die width-Schreibgeschützte Eigenschaft der SVGPatternElement-Schnittstelle beschreibt die Breite des Musters als ein SVGAnimatedLength. Sie spiegelt den berechneten Wert des width-Attributs auf dem <pattern>-Element wider.
Der Attributwert kann ein \<length>, \<percentage>, oder \<number> sein. Der numerische Wert des SVGAnimatedLength.baseVal repräsentiert die Breite des Musters im Benutzerkoordinatensystem.
Ein SVGAnimatedLength.
Im folgenden SVG:
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<defs>
<!-- First pattern -->
<pattern
id="pattern1"
x="50"
height="20"
width="20"
patternUnits="userSpaceOnUse">
<circle cx="10" cy="10" r="10" fill="blue" />
</pattern>
<!-- Second pattern -->
<pattern
id="pattern2"
x="100"
height="40"
width="40"
patternUnits="userSpaceOnUse">
<circle cx="20" cy="20" r="10" fill="red" />
</pattern>
</defs>
<!-- Using the patterns -->
<rect x="0" y="0" width="100" height="100" fill="url(#pattern1)" />
<rect x="100" y="0" width="100" height="100" fill="url(#pattern2)" />
</svg>
Können wir auf die berechneten Werte der x-Attribute zugreifen:
const patterns = document.querySelectorAll("pattern");
console.log(patterns[0].width.baseVal.value); // output: 20
console.log(patterns[1].width.baseVal.value); // output: 40
Diese Seite wurde automatisch aus dem Englischen übersetzt.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4