foreignObject

The foreignObject SVG element includes elements from a different XML namespace. In the context of a browser, it is most likely (X)HTML.

Usually, this element is created with:

const foreignObject = parentElement.add('foreignObject')

It's possible to create it as a disconnected element with gSVG('foreignObject') and attach it to the SVG document with .attachTo().

More info: mdn | w3c

.height()

foreignObject.height( height )

Set the height of the foreignObject.

• argument: {number|string} height The height (length or percentage) of the foreignObject

• returns: {gSVGObject} The original object

const height = element.height();

Get the height current value.

• returns: {number|string}

.width()

foreignObject.width( width )

Set the width of the foreignObject.

• argument: {number|string} width The width (length or percentage) of the foreignObject

• returns: {gSVGObject} The original object

const width = element.width();

Get the width current value.

• returns: {number|string}

.x()

foreignObject.x( x )

Set the x coordinate of the foreignObject.

• argument: {number|string} x The x (length or percentage) coordinate of the foreignObject

• returns: {gSVGObject} The original object

const x = element.x();

Get the x current value.

• returns: {number|string}

.y()

foreignObject.y( y )

Set the y coordinate of the foreignObject.

• argument: {number|string} y The y (length or percentage) coordinate of the foreignObject

• returns: {gSVGObject} The original object

const y = element.y();

Get the y current value.

• returns: {number|string}

• Parent elements: a | defs | g | marker | mask | pattern | svg | switch | symbol.