Advanced guide to Map Builder
Introduction
In this article, we delve into the advanced features of the Map Builder that can elevate your map editing skills. Previously, we covered the differences between Basic Maps and Premium Maps and demonstrated how to create a map, add, edit, remove objects, and publish changes in Flexopus. If you haven't read those articles, we recommend doing so first. Here, we'll focus on using premium maps as examples. Note that some features discussed are exclusive to premium maps and not available on basic maps.
Application layout
The Map Builder application is built up of four major parts. You will find every important function in one of these areas, arranged to be as easy to use as possible.
Header
In the application header, you can find application-level information and actions.
To access global actions in the Map Builder, use the Options menu (⋮) located in the left corner. Some actions are only available in the dropdown, or via shortcuts.
Next to the Options menu, you'll find the Tool Selector, which allows you to switch between the basic tools, such as the Pan tool, Selection tool, and Create Objects tool.
At the right end of the header, you'll see the Close and Publish buttons. Once you've finished working on your map, you can exit the application using either button. Publish saves your changes, while Close exits without saving.
Left panel — Layers panel
The left panel contains all the layers of the application, with editable objects grouped by type into layers such as Workspaces or Furniture. You can expand or collapse these groups to organize the space more efficiently.
- Objects with active bookings are highlighted in amber.
- Newly added objects are emphasized with a turquoise highlight.
This helps you quickly identify active and recently added elements on the map.
Right panel — Tools & Properties
The right panel serves a double purpose. On one hand, it is used to display options for adding a new object, and on the other hand, it hosts the settings panel where you can modify all the properties of a selected object.
Canvas
The central part of the application is the map canvas itself. All the objects are displayed on the canvas, except for the ones you explicitly hide. You can navigate on the canvas with the Pan tool, the scroller button of your mouse, or the zoom controls in the bottom right corner of the canvas. To select one or more objects, use the Selection tool. When enabled, rulers make it easier to position objects. For further accuracy, you can enable a grid overlay.
You can access some of the object-level actions by right-clicking on one of the objects, and some basic application-level actions by right-clicking the background of the canvas.
Basic tools
You can control the application with the three base tools, which you can select in the header panel.
Pan tool
You can activate the Pan tool in the following ways:
- Click the palm icon in the header.
- Hold Space while using the Selection tool.
- Press N if shortcuts are enabled.
This allows you to easily move the map around without interacting with the objects.
With the Pan tool, you can grab the map and navigate without accidentally moving any of the objects. Use the zoom controls, or the mouse wheel to zoom in or out.
Selection tool
You can activate the Selection tool in two ways:
- Click the cursor icon in the header.
- Press V if shortcuts are enabled.
This allows you to select, move, and modify objects on the map.
As the name suggests, the selection tool's main function is to select objects on the map. Click on any object to select them, or draw a bounding box by holding down the left mouse key, to select one or more neighboring objects.
You can then drag and move objects, or rotate them by dragging the handle at their corner. When moving close to other objects, guidelines appear to help precisely position the object.
Create objects tool
To add new objects to the map, select the Create Objects tool from the header. This will allow you to place new items on the map.
Once you have activated the tool, you will be asked to select the type of object you want to create. You can do this by clicking a category on the right panel.
Most object types have variants or configurations. Select the variant from the list and click anywhere on the map to place a new object. You can also create items by dragging and dropping them directly on the map.
Project-level functions
Publish & close
There are two ways of exiting Map Builder: you can either close the app and discard your changes, or publish the changed map to Flexopus. Either way, you will be taken back to the Flexopus admin dashboard.
Export SVG
Flexopus maps are stored in SVG format, using a custom scheme for representing static and bookable objects. You can download your floor plan from the Map Builder and make changes to it in your preferred SVG editor tool. Once you made your changes send the updated map to support@flexopus.com and our colleagues will upload it for you. All maps will be manually evaluated to match the Flexopus Map Scheme, ensuring no mistakes are made.
To download your SVG map, click the Options menu in the top left corner of the application and select Export as SVG from the dropdown menu, or press ⌘ + E anywhere in the app to quickly export the map.
When exporting your map as an SVG, you will be prompted to select the resolution of the exported map. After making your selection, click Export SVG to download the file to your computer.
If there are hidden objects or text with 0% opacity on the map, you will be prompted to decide how to handle them during the export process. You can choose to include or exclude these elements.
Export PNG
For your convenience, you can also download a PNG version of the map if you require a raster image format.
To download the PNG file:
- Select Export as PNG from the dropdown menu in the top left corner, or
- Press Ctrl / ⌘ + Shift + E anywhere in the app to quickly export the map as a PNG file.
Object-level functions
Changing object properties
All objects in Flexopus have common properties such as name, position, mirroring, rotation, and size. Some of these properties may be fixed and not editable. You can manage these attributes through the properties panel, the canvas, or the layer list panel. Below are the methods to change an object's name:
- Method 1: Select the object on the canvas using the Selection tool and change the name in the properties panel.
- Method 2: Double-click the object name in the layers panel to enter Edit mode.
- Method 3: Click the options button (⋮) next to the object in the layers panel, and select Rename from the menu to enter Edit mode.
These multiple options allow flexibility in managing object attributes.
To change the position of an object, you have several options:
Change in the properties panel:
These methods give you precision when positioning objects on the map.
- Select the object on the canvas using the Selection tool.
- In the properties panel, adjust the X and Y positions.
- You can use the up/down arrow keys in the input field to change the value. Hold Shift for bigger increments.
Drag on the canvas:
- Use the Selection tool to drag and move the object directly on the canvas.
Use arrow keys:
- Select the object and use the arrow keys (up/down or left/right) to move it pixel-by-pixel.
Mirror object: once selected, click the horizontal or vertical flip buttons to mirror the object over the X or Y axis.
To change the rotation of an object, you have two main options:
Rotate freely on the canvas:
These methods give you control over the rotation of objects.
- Select the object on the map.
- Drag the corner of the object to rotate it. When you hover over the correct handle, the cursor will turn into a rotation sign (↻).
Rotate precisely in the properties panel:
- In the properties panel, enter a specific rotation value in degrees for precise adjustments.
- Alternatively, click the rotate buttons to change the rotation by 90° increments.
Changing the size: the size of most objects is fixed, with two exceptions.
- On Basic Maps, objects have a globally set size that applies to all of them by default. You can change this by selecting an object and adjusting the Size property in the properties panel.
Additionally, the background image can also be resized:
- Simply drag the corner of the image to adjust its size as needed.
These features allow you to tailor both the objects and the background image to fit your map layout.
Copy & paste
To duplicate objects:
- Select the object(s) you want to duplicate.
- Press Ctrl / ⌘ + C to copy them.
- Press Ctrl / ⌘ + V to paste the duplicated object(s).
The duplicated object will appear next to the original counterpart on the map.
You can also copy an object by opening the options menu (⋮) in the layers panel and selecting Copy.
Lock & hide
Two object states can alter an object's visibility and interactivity on the map: locked and hidden.
- Locking objects prevents unwanted changes while you focus on editing others. For example, after placing bookable desks, you may want to lock them while arranging furniture or decorations. On Basic Maps, the background image is locked by default to prevent accidental movement.
To lock or unlock an object:
- Click the lock icon in the layers panel.
- Select Lock/Unlock in the options menu.
- Press Ctrl / ⌘ + L to quickly toggle the lock state.
This helps maintain control over which objects can be modified.
The hide feature is useful when you need to focus on a specific part of the map or modify overlapping objects. Hidden objects are completely removed from the canvas but remain accessible through the layers panel.
To hide or show an object:
- Click the eye icon in the layers panel.
- Select Hide/Show from the options menu.
- Press Ctrl / ⌘ + H to toggle the visibility of the object.
This allows you to work more efficiently by clearing clutter from the workspace without deleting objects.
The lock and hide features can also be used on a group level, by clicking the lock or the eye icon next to a layer's name in the layers panel.
Layer ordering
In most cases, layer order isn't a concern, as floor plans typically don't contain overlapping objects. However, if your floor plan does have overlapping elements, you'll need to consider the layer order.
Objects on the map are stacked in the same order as they appear in the layers panel. This means that the first object in the list is displayed on top. Adjusting the order of layers can help ensure that objects are correctly displayed in relation to one another.
You can modify the layer order of objects using four actions:
- Bring to Front: Moves the selected object to the top of the layer stack.
- Send to Back: Moves the selected object to the bottom of the layer stack.
- Shift Up: Moves the object one layer up.
- Shift Down: Moves the object one layer down.
These actions are available in the options menu or can be done using keyboard shortcuts for quick adjustments.
Delete
The application offers 3 ways to delete unnecessary objects:
- Select Delete from the options menu in the layers panel.
- Select the object, then click the trash bin icon in the properties panel.
- Select the object(s) and press Backspace or Del on your keyboard.
These options allow you to efficiently remove objects from the map.
In any case, you will be asked to confirm the deleting operation. You may also select multiple objects and delete them at once.
Shortcuts
To make the Map Builder easier to use, most actions have corresponding keyboard shortcuts. To view a full list of shortcuts, simply click on Keyboard Shortcuts in the bottom right corner of the application. This will display all available shortcuts for quicker navigation and editing.
By default, shortcuts are turned on. This may cause issues since binding the key combinations to Map Builder might prevent the system or other apps from handling important keyboard shortcuts. If you experience any blocking issues, you can disable Map Builder's shortcut handling in the dialog.
You can find all the possible shortcuts listed here below.
Action | Shortcut |
---|---|
Close editor | ⇧Q |
Save & Publish | ⌘P |
Export as SVG | ⌘E |
Export as PNG | ⌘⇧E |
Activate "Navigation" tool | N |
Activate "Selection" tool | V |
Activate "Spaces" tool | T |
Activate "Parking" tool | P |
Activate "Rooms" tool | M |
Activate "Special Object" tool | X |
Activate "Furniture" tool | F |
Show/Hide grid | ⇧G |
Show/Hide ruler | ⇧R |
Show/Hide navigation | ⇧N |
Zoom in | W |
Zoom out | S |
Reset zoom | E |
Rename selected layer/s | Dbl Click |
Copy selected layer/s | ⌘C |
Paste layer/s | ⌘V |
Hide/Show selected layer/s | ⌘H |
Lock/Unlock selected layer/s | ⌘L |
Delete selected layer/s | ⌫ |
Shift up | ⌘ + arrow up |
Shift down | ⌘ + arrow down |
Bring to front | ⌘⇧ + arrow up |
Send to back | ⌘⇧ + arrow down |
Move layer | arrow keys |
Fast move layer | ⇧ + arrow keys |