SVGForeignObjectElement: y-Eigenschaft

Baseline Weitgehend verfügbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.

Die y-Schreibgeschützte Eigenschaft der Schnittstelle SVGForeignObjectElement beschreibt die y-Achsen-Koordinate des <foreignObject>-Elements. Sie spiegelt den berechneten Wert des y-Attributs auf dem <foreignObject>-Element wider.

Der Attributwert ist eine \<length>, ein \<percentage> oder eine \<number>. Der numerische Wert von SVGAnimatedLength.baseVal ist die y-Koordinate des <foreignObject>-Elements im Benutzerkoordinatensystem.

In diesem Artikel

Wert

Ein SVGAnimatedLength.

Beispiel

Angenommen, das folgende SVG ist gegeben:

html
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <foreignObject id="object1" x="50" y="75" width="100" height="50">
      <div xmlns="http://www.w3.org/1999/xhtml">
        <p>This is a foreign object.</p>
      </div>
    </foreignObject>
    <foreignObject id="object2" x="25%" y="50%" width="10%" height="10%">
      <div xmlns="http://www.w3.org/1999/xhtml">
        <p>This is another foreign object.</p>
      </div>
    </foreignObject>
  </defs>
  <rect x="0" y="0" width="200" height="100" fill="lightblue" />
  <rect x="0" y="100" width="200" height="100" fill="lightgreen" />
</svg>

Wir können auf die berechneten Werte der y-Attribute zugreifen:

js
const foreignObjects = document.querySelectorAll("foreignObject");
const yObject1 = foreignObjects[0].y;
const yObject2 = foreignObjects[1].y;

console.dir(yObject1.baseVal.value); // output: 75
console.dir(yObject2.baseVal.value); // output: 100 (50% of 200)

Spezifikationen

Spezifikation

Scalable Vector Graphics (SVG) 2
# __svg__SVGForeignObjectElement__y

Browser-Kompatibilität

JavaScript aktivieren, um diese Browser-Kompatibilitätstabelle anzuzeigen.

Siehe auch

Help improve MDN

War diese Übersetzung hilfreich?

Ja Nein

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden