Iglooview
...
This page generates a cubemap of the Matterport model the service is currently in. See the required settings above.
Click within the viewports to move around the space - if you click one of the white circles on the floor, you’ll move to that sweep (or just click the direction you want to move). This also works with Igloo Touch on the Web canvas.
You can also click Mattertags, if the space has any, to see whatever content they contain. (Mattertags are just buttons within a model that display text, links, or images when clicked).
URL parameters on iglooview
sid
- (space ID) - This is always present on iglooview pages, and contains the space ID of the current space. This allows you to easily make Igloo Web bookmarks/Home Layouts without additional steps. If you want to navigate to a specific space ID, you can change this parameter to a different space ID.
...
The Igloo Matterport Service enables viewing and navigation of Matterport models in an immersive space.
Requirements
An annual license is required for this service.
Overview
Most standard Matterport features, including Mattertags, are supported. The service’s control page allows navigation of a model using a mobile device, and generation of a space’s floorplans to aid that process.
A single frame view allows use of Matterport in non-360 modes - (i.e. a single wall of an immersive room), and there’s easy support for <360 degree immersive projection surfaces.
There’s also a favourites system for Matterport spaces, allowing easy management of a collection of saved spaces for rapid viewing, as well as a one-click integration with any Matterport model embedded into a native website (no changes necessary - just click a bookmark and be taken straight to any Matterport model).
Matterport session
A Matterport session is included in the example Igloo Core Engine database. This consists of a single layer giving a full canvas view of the current Matterport space. The space can be navigated using the app in Igloo Control Panel.
...
Igloo Control Panel App
The control page allows easy movement around a Matterport space, and between different Matterport spaces. It’s accessible at http://localhost:
...
800/matterport/control/ in Chrome, or at the same port/page on mobile devices using the media server’s local IP (e.g. http://10.0.0.1:
...
800/matterport/control/). You can use the Mobile link in the page’s Settings menu to easily access the mobile control view using a QR code - see the Settings section below.
You can use the viewport at the top half of the page as normal, and any time you move between sweeps any other connected pages will synchronize.
Overview
...
Favourites
...
...
Click the 📖 icon to open/close the favourites menu.
Click a Matterport space within this menu to navigate to that space.
Click a folder to open that folder, showing the items it contains. To get out of a folder, click the back arrow in the top left of the menu.
...
Click the Add button to add a panorama to your favourites.
Editing the favourites menu
...
Click the Edit button at the top right of the menu to enter edit mode, giving additional icons within the menu.
...
The pencil icon renames a favourite item or folder - a dialogue box will appear for you to type in a new name.
If you leave the name of a favourites item blank, it will be change back to its default, Matterport-provided name.
The ❌ icon deletes a favourite item or folder - if it’s a folder, the entire folder and its contents will be deleted.
The ☰ icon is a drag handle. It allows re-organisation of the favourites menu.
Click and drag the drag handle to pick an item up, then drop it to move it to the location indicated.
A white line will show the destination of the item if moving within a list
If you drop an item on top of a folder, it will be moved into that folder - this is indicated by the background colour of the destination folder.
To move an item out of a folder, drop it on top of the back arrow in the top left of the menu
The favourites menu will autoscroll if required when dragging an item around
Press the new folder icon in the top right of the menu to create a new folder
Press Done to leave edit mode
...
title | History (-ish icon) - top left |
---|
...
Click the 🔄-ish icon to open/close the history menu.
...
.
This menu will always display a model’s Matterport-provided name, and will not change based on whether a space has been favourited or not. If a name hasn’t been given by the Matterport model’s author, it will display as “Untitled”.
Click an item within the menu to navigate to that space.
Press Clear to remove every item from this list.
Expand | ||
---|---|---|
| ||
The top banner will display the name of the currently loaded space. If the space is present in the favourites menu, the name it’s been provided with as a favourite will be display instead. If the Matterport model that’s been loaded hasn’t been given a name by its author, this will display “Untitled”. |
Expand | ||
---|---|---|
| ||
Press the ⚙️ to open/close the menu. Transition mode This option determines how other pages will move between panoramas when synchronising with each other. Individual panorama viewers will always use the Fly transition mode when moving in response to clicks within them, but this option will determine how movement is performed when initiated from another page or from the floorplans. Space ID The text box in this section of the menu will display the space ID of the current space. The space ID is an unique identifier for a Matterport space, mostly used internally - you generally shouldn’t need to think about them when using this integration, but the option is provided. Refresh Iglooview The button on the right hand side of this entry will cause all viewers to rotate to their given rotation, which will re-create a valid cubemap on the Iglooview page if it’s been disrupted in some way. Dark mode Change the colour mode of the user interface. Use default Mattertags Override Mattertag rendering mode to the Matterport default, until the page is next refreshed; see the Mattertags section below for details. This setting is applied to all currently connected iglooview frames, so needs to be toggled after the tabset has been loaded. Lock wrap to camera With this option toggled on, camera rotations within the Matterport viewer at the top half of the control page will adjust the orientation of the equirectangular image generated by Igloo Web. Lock camera to orbitview With this option toggled on, any connected orbitview pages will mimic all camera movements made within the Matterport viewer at the top half of the control page. Vertical stretch and position These sliders allow easy adjustment of Warper parameters without having to enter Igloo Web/Warper settings menus. Vertical stretch adjusts the vertical scale of the equirectangular image on the Warper canvas - e.g. increasing this value makes objects appear taller, and shows a smaller vertical proportion of the panorama. Vertical position adjusts the position of the equirectangular image on the Warper canvas - increasing this value moves the image up on the canvas, showing more of the ground. Decreasing this value moves the image down on the canvas, showing more of the sky. These sliders can both be right-clicked (or long-pressed on Mobile) to reset the value to its default. These options are useful to fine-tune the display of a Matterport model so it looks reasonable within in any given Igloo structure without having to dive into Warper settings menus. Mobile link and version number The bottom right of the menu displays the version number of the app. The Mobile link at the bottom left of the menu opens a window containing a QR code, which links directly to the control page using the media server’s local IP. |
Expand | ||
---|---|---|
| ||
Click this button to generate floorplans of the current Matterport space. This is discussed in more detail below. |
Expand | ||
---|---|---|
| ||
Mattertags are used by model-authors to provide more information about things in the model. They initially display as coloured disks, as seen on the right: Clicking one of these disks opens a small box, containing text (and/or media) provided by the model’s author: Clicking one of these disks on the control page will open a similar box on the iglooview page which will try to display the same content. Currently text will be displayed, along with any embedded YouTube videos, flickr images, or directly-linked images (i.e. images hosted on a customer’s own website). Other types of embedded videos and images will not be rendered, and a link will be displayed instead. Please get in touch if you need more providers added to this list. Clicking Mattertags in Igloo Web (including by using Igloo Touch) will result in the same behaviour. Following any links embedded within Mattertags will open a new tab in Igloo Web at the link’s destination. Closing Mattertags When a tag is open on an iglooview page, this button will be displayed on the Control page - click it to close any open Mattertags. Overriding this behaviour If you’d like to use Matterport’s default behaviour when rendering Mattertags, there is a toggle in the Settings menu to allow this: With this option toggled on, clicking a Mattertag will render it using Matterport’s default behaviour. Be aware that this is very likely to temporarily disrupt the panorama, as the camera will be re-orientated to display the Mattertag in this mode. You can refresh the camera positions using the option in the Settings menu, or by visiting a different panorama within the model. This option must be toggled after the tabset has been loaded in Igloo Web, and will reset to the original behaviour when loading a new model. |
Floorplans
Clicking the Generate floorplans button in the bottom half of the page begins floorplan generation for the current space.
The panorama viewer at the top half of the screen will cycle through the available floors and take screenshots of them, then arrange them in a viewer in the bottom half of the screen. Once floorplan generation is complete, the panorama viewer will return to its previous position
If floorplans aren’t available for a model, an error message will be displayed - sometimes it’s worth refreshing the control page and re-trying to generate floorplans as some other errors can cause floorplan generation to fail. Usually, though, this is due to the model’s author disabling the viewing of floorplans.
Floor selection
...
If a model contains multiple floors, this section will display a button for each floor that’s been generated. The current floor is highlighted in green, and the other buttons can be pressed to switch to that floor.
Panorama buttons
...
The rest of the bottom half of the screen will display the model’s floorplan.
A button is shown for each panorama that the model contains; these can be clicked to navigate directly to that panorama.
The currently active panorama is displayed in red.
...
The black arrow around the button representing the current panorama shows the orientation of the control page’s panorama viewer - this will rotate when the control page’s panorama camera rotates.
The floorplans also display any labels that the Matterport model’s author has appended to their own floorplans.
Transforming the floorplans
Floorplan images can be zoomed and moved, similar to Google Maps behaviour. On desktop, the scrollwheel will zoom the floorplan and clicking/dragging will move the image.
On mobile, pinch-to-zoom and dragging the image will perform the same functions.
Resetting floorplan transforms (recentring)
...
This button in the bottom right will reset any zooming/panning the user has performed.
...
Orbitview
This page is a fullscreen panorama viewer. It’s accessible at http://localhost:
...
...
a WebView or Chrome, or at the same port/page on mobile devices, using the media server’s local IP (e.g. http://10.0.0.1:
...
Its intended use is for things like displaying non-360 degree content on one wall of an Immersive Room, but can be used anywhere you’d like non-360 content.
There aren’t any additional controls but, like other pages, it can be used for navigation - any movements will synchronise with all other connected pages.
Orbitview’s camera orientation can be remotely controlled from the control page - see the section on the Settings menu above.
Bookmarklet
Bookmarklet setup instructions are
...
On desktop, you just need to drag the button displayed on that page to your bookmarks bar.
...
here: https://360igloo.atlassian.net/wiki/spaces/ID/pages/3396829185/Utilities#bookmarklet .
Once set up, you can use the bookmarklet on any web page that contains a Matterport model.
Make sure the matterport model you want to visit is playing (i.e. you are able to navigate around the model on the webpage)
Click the bookmarklet from your bookmarks bar, or by viewing bookmarks on your mobile device and tapping it.
A pop-up will appear, and:
If there was only one matterport model on the page, the service will navigate there straight away
If there were multiple matterport model on the page, the popup will display a list of the models it could fine - the service will navigate to the item you click in this list.
If there weren’t any matterport models on the page, or the bookmarklet couldn’t find any, an error will be displayed by the pop-up.
To use the control page, make sure you return to http://localhost:
...
Popups being blocked might interfere with this process.
Licensing
Please contact a member of the Igloo Sales team for the current license fee for the Igloo Matterport Service. The service is charged for as a subscription on an annual basis.
The Matterport API key is stored in
...
the igloo-core-service config.json
.