Code examples

Highlight assets based on the space that they are in

Spaces and Assets reference each other. This can be used to set the highlight (change the color) accordingly.

Highlight assets and spaces on mouseover

The basic logic:

// Listen to mouse events
floorPlan.on('mousemove', handleMouseMove, floorPlan)

function handleMouseMove(evt) {
  const { pos } = evt
  // get spaces and assets for the current position
  let { spaces, assets } = this.getResourcesFromPosition(pos)
  // highlight the corresponding nodes
  if (assets.length) assets[0]?.node.setHighlight({ fill: [255, 200, 100] })
}

Add marker on click

The following example demonstrates the adding a marker on click.

IoT sensor demo, showcasing how to visualize data from external sources

In this case meeting spaces and desks are highlighted based on occupancy data from IoT sensors.
The data updates every 5 seconds.

Access private model

The following example demonstrates how to access a private model from the front end using temporary access tokens.