DOM Component

src/graphics/dom.js#L4-L10

A component which renders entities as DOM nodes, specifically <div>s.

Properties

Methods

Back to top

._element

src/graphics/dom.js#L12-L17

The DOM element used to represent the entity.

Back to top

.avoidCss3dTransforms

src/graphics/dom.js#L22-L28

Avoids using of CSS 3D Transform for positioning when true. Default value is false.

Back to top

.css()

src/graphics/dom.js#L226-L260

Events

SetStyle [propertyName = {string}]
for each style that is set
public css(String property, String value)
property

CSS property to modify

value

Value to give the CSS property

public css(Object map)
map

Object where the key is the CSS property and the value is CSS value

Apply CSS styles to the element.

Can pass an object where the key is the style property and the value is style value.

For setting one style, simply pass the style as the first argument and the value as the second.

The notation can be CSS or JS (e.g. border-radius or borderRadius).

To return a value, pass the property.

Note: For entities with "Text" component, some css properties are controlled by separate functions .textFont(), .textAlign() and .textColor(). When possible, prefer text-specific methods, since they will work for non-DOM text. See the Text component for details.

Example

this.css({'border': '1px solid black', 'text-decoration': 'line-through'});
this.css("textDecoration", "line-through");
this.css("text-Decoration"); //returns line-through
Back to top

.DOM()

src/graphics/dom.js#L101-L113

Events

Draw [Data = { style:String, type:"DOM", co}]
when the entity is ready to be drawn to the stage
public this .DOM(HTMLElement elem)
elem

HTML element that will replace the dynamically created one

Pass a DOM element to use rather than one created. Will set ._element to this value. Removes the old element.

Will reattach the entity to the current draw layer

Back to top

.draw()

src/graphics/dom.js#L124-L133
public this .draw(void)

Updates the CSS properties of the node to draw on the stage.

Back to top

.getDomId()

src/graphics/dom.js#L62-L70
public this .getDomId()

Get the Id of the DOM element used to represent the entity.