Canvas Tiles

Create interactive floor plans, equipment diagrams, and visual site maps by placing live Motion Tiles on an uploaded image.

Canvas Tiles let you place live Motion Tiles on top of an uploaded image, creating an interactive visual representation of a physical space, system, or piece of equipment.

For example, you can upload a floor plan, site map, equipment diagram, or photograph and position relevant tiles directly where the associated devices or sensors are located. Users can then view live values, navigate the Canvas, open tile details, group nearby tiles with Canvas Clustering, and use Motion Replay to review values from an earlier point in time.

Canvas Tiles display at full width within a linked Mosaic App and are fully supported on desktop and mobile.

Common uses for Canvas Tiles

Canvas Tiles are especially useful when the physical location of a device or sensor provides important context.

Common examples include:

• Data center floor plans

• Building and room layouts

• Mechanical and electrical diagrams

• Equipment or system photographs

• Sensor deployment maps

• Site plans

• Mobile troubleshooting and inspection workflows

Instead of navigating a large dashboard containing hundreds of individual tiles and tile folders, users can locate and review data within a visual representation of the actual environment.

Before you begin

Before creating a Canvas Tile:

1. Create the tiles that you want to place on the Canvas.

2. Prepare the image that will be used as the Canvas background.

3. Create or identify the Mosaic App where the Canvas will appear.

Canvas supports the following image formats:

• .png

• .jpg

• .jpeg

• .webp

The following tile types can be placed on a Canvas:

• Numeric tiles

• Toggle tiles

• Multi-choice tiles

• Tile folders

Other SuperTiles cannot be placed on a Canvas, and a Canvas Tile cannot be placed inside another Canvas Tile.

For more information about supported tiles, see Tile Types. To create the underlying tiles first, see Creating Point-Based Tiles.

Creating a Canvas Tile

Step 1: Open the Tiles area

Navigate to the Tiles area of the Motion Platform and select the option to add a new tile.

Select Canvas from the available SuperTile options.

Step 2: Configure the Canvas Tile

Enter the standard configuration information for the Canvas Tile, including its name, display name, profile, facets, tags, appearance, and linked Mosaic App.

Canvas Tiles use many of the same standard configuration options as other Motion Tiles. For more information, see Configuring Motion Tiles.

Step 3: Upload the Canvas image

In the Canvas configuration view, upload the image that will be used as the Canvas background.

The uploaded image may be a floor plan, diagram, site map, photograph, or another visual that helps users understand where each tile belongs.

Adding tiles to the Canvas

After uploading the image, you can place existing Motion Tiles on the Canvas.

Steps

1. Move your cursor over the desired location on the Canvas.

2. A small + icon appears at the selected location.

3. Select the + icon.

4. Search for and select the tile you want to add.

5. Repeat these steps to add additional tiles.

6. Select Save when you have finished configuring the Canvas.

The tile appears at the location selected on the image.

The same underlying tile can remain as a standalone tile in an app and can also be used on multiple Canvas Tiles.

Placing multiple tiles in the same location

Multiple tiles can be placed at the same Canvas location. When necessary, their display order can be adjusted from the tile’s configuration options.

Removing or repositioning a tile

To remove a tile from the Canvas:

1. Open the Canvas configuration.

2. Select the placed tile.

3. Select the option to remove it.

4. Select Save.

Placed tiles cannot currently be dragged to a new position. To reposition a tile, remove it and add it again at the desired Canvas location.

Linking a Canvas Tile to a Mosaic App

A Canvas Tile must be linked to a Mosaic App before it appears on an app dashboard.

You can link the Canvas during configuration by selecting the applicable app in the Apps section.

Select Save to apply the Canvas configuration and app linkage.

For more information about Mosaic Apps, see Creating a Mosaic App and Configuring a Mosaic App.

Viewing and navigating a Canvas

Canvas Tiles display at full width within the linked Mosaic App.

From the Canvas, users can:

• View current tile values

• Zoom in or out

• Pan across the uploaded image

• Open details for an individual tile

• Enable Canvas Clustering

• Review historical values with Motion Replay

The icon and color used for each placed tile come from the configuration of the underlying Motion Tile.

When a tile does not yet have a current value, the Canvas displays a loading indicator until a value becomes available.

Opening tile details

Select an individual tile on the Canvas to open its details in the tile drawer at the bottom of the screen.

The drawer displays the full tile information associated with the selected Canvas marker.

Select outside the drawer or close it to return to the full Canvas view.

Alarm Badges on Canvas Tiles

When a tile displayed on a Canvas enters an alarm state, its mini tile displays a badge indicating whether the alarm is acknowledged or unacknowledged.

This makes it easier to identify active alarm states directly from the floor plan. Select the mini tile to display the expanded tile below the Canvas, where you can review the current alarm state and access the available tile actions.

For more information about viewing and managing alarms, see Current Alarms and Clearing/Acknowledging Alarms.

Using Canvas Clustering

Canvas Clustering makes it easier to navigate Canvas Tiles that contain many closely positioned data points.

To enable Canvas Clustering, select the layer icon in the Canvas navigation controls.

When clustering is enabled:

• Individual tiles are grouped when the Canvas is zoomed far enough out.

• Each numbered cluster shows how many tiles are contained within that area.

• Clusters automatically separate into smaller groups or individual tiles as you zoom in.

• Clustering adjusts dynamically based on tile location and the current zoom level.

For example, a cluster containing 21 tiles may separate into two clusters containing 8 and 13 tiles as the user zooms further into the Canvas.

Viewing the tiles in a cluster

Select a numbered cluster to open the tile drawer.

The drawer displays the tile details for all tiles included in the selected cluster.

Zoom in to return to the individual tile markers within that area.

Using Motion Replay

Motion Replay lets users view the Canvas and its tile values as they appeared at an earlier point in time.

The Motion Replay controls include:

Control	Description
Older	Moves backward through historical Canvas values.
Newer	Moves forward through historical Canvas values.
Step	Determines how far backward or forward the Canvas moves with each selection.
Latest	Returns the Canvas to the latest available values.

Steps

1. Select the desired Step value.

2. Select Older to move backward through historical values.

3. Continue selecting Older or Newer to navigate through time.

4. Select Latest to return to current values.

Motion Replay updates the values shown across the Canvas, making it possible to review how conditions appeared throughout a physical environment at a previous point in time.

Using Canvas Tiles on mobile

Canvas Tiles are fully supported in the Motion mobile experience.

Mobile users can:

• View the full Canvas

• Zoom and navigate around the uploaded image

• Select individual tiles

• Open tile details

• Interact with Canvas Clustering

• Use Motion Replay

This makes Canvas Tiles especially useful for technicians, engineers, and other users who need to review live data while physically moving through a building, site, or equipment area.

Editing an existing Canvas Tile

An existing Canvas Tile can be configured from either the app dashboard or the Tiles area of the Platform.

From the app dashboard

1. Open the Mosaic App containing the Canvas.

2. Open the Canvas Tile options.

3. Select Configure.

From My Tiles

1. Navigate to Tiles.

2. Locate the Canvas Tile under My Tiles.

3. Open the tile menu.

4. Select Configure Tile.

From the configuration view, you can:

• Add tiles

• Remove tiles

• Change tile order

• Replace the background image

• Update the Canvas appearance

• Link or unlink apps

Replacing the background image

You can replace the Canvas background image from the Canvas configuration view.

When the image is replaced, Motion preserves the existing tile coordinates as closely as possible. However, tile placement may appear different if the new image has different dimensions, proportions, or content.

Review the placement of existing tiles before saving the new image.

Select:

• Save to apply the changes.

• Revert to return to the previously saved Canvas configuration.

Image best practices

For the clearest Canvas experience:

• Use an image with enough detail to identify important locations.

• Crop unnecessary whitespace or content before uploading.

• Use a consistent image orientation.

• Use an image that remains readable when viewed on both desktop and mobile.

• Compress unusually large image files while preserving the necessary detail.

• When replacing an existing image, use similar dimensions and proportions when possible to help preserve tile placement.

Related articles

• Creating Point-Based Tiles

• Configuring Motion Tiles

• Creating a Mosaic App

• Configuring a Mosaic App