Skip to content

CSSLayoutObject

Fennec-hub edited this page Mar 9, 2024 · 2 revisions

Manages it self positioning, scaling and rotation relative to its parent CSSLayout in relation to the referenced HTMLElement. Must be a CSSLayout's Child.

Properties

.fit

Emulate CSS's object-fit property, can be "contain", "fill" or "cover", default "contain".

.domElement

The reference HTMLElement.

.objectNeedsUpdate

Set to true to recompute the Object3D's boundingBox (less performant).

.elementNeedsUpdate

Set to true to recompute the related HTMLElement's clientBoundingBox (less performant), default false.

Methods

constructor

constructor(domElement: HTMLElement | string, fit: "cover" | "contain" | "fill")

CSSLayout child object will be mapped in reference to the domElement.

  • domElement: The reference element, can be an HTMLElement or a CSS querySelector string, example "#my-3d-model".
  • fit: Emulate CSS's object-fit property, can be"contain", "fill" or "cover", default "contain".

.fitLayout

fitLayout(updateElement: boolean, updateObject: boolean)

Fit the object relative to its parent CSSLayout while mapping the transformations of the referenced HTMLElement.

  • updateElement: Set to true to recompute the related HTMLElement's clientBoundingBox (less performant), default false.
  • updateObject: Set to true to recompute the Object3D's boundingBox (less performant).

Events

onBeforeFit

Event triggered before fitting any CSSLayoutObjectchild objects, useful for making adjustments before computing the transformations.

onFit

Event triggered after fitting all the CSSLayoutObject child objects, useful for making post transformation adjustments.

Clone this wiki locally