Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Igloo We have developed an integration with Google Street View for viewing street panoramas in 360 degrees.

Creating a StreetView Layer

This layer will display the Street View panorama.

Info

This tutorial requires a session called Streetview to have been setup using the Desktop UI. See the tutorial: Desktop UI - Exploring Google Street View .

Tutorial Video

...

Loading a StreetView Panorama Layer

...

Press the Add Content button in the Canvas Toolbar and select New > WebView.

Set the URL of the new WebView to be http://127.0.0.1:9070/iglooview. This URL is an endpoint in the Igloo StreetView Service which is runs as a Windows service. The endpoint generates a cubemap which can be used to give a 360 degree image in the Igloo. Set the Size parameters to be 12000 x 2000 and untick the Dynamic Browser Resolution checkbox. The display does not change frequently so we can lower the frames per second (FPS) to 10. Untick the Show UI checkbox in the General properties so that the WebView toolbar doesn’t interfere with the cubemap.

...

The next step is to transform the cubemap into a 360 view suitable for the Igloo canvas.

...

Click on the Effects tab and press the Add button. Select ‘Cubemap to Equirectangular’.

Image Removed

The cubemap now appears as an equirectangular image.

Image Removed

Press the Add button again and select ‘True Perspective’.

The resulting view is a full screen image calculated for the Igloo canvas you are using.

...

Creating Additional Layers

The ICE control panel has a tab called Streetview and this Content Library.

Image Added

Select the session named ‘Streetview’.

This will load a WebView layer pointing to the Igloo StreetView Service URL and with appropriate settings to display across the whole canvas.

...

Creating a StreetView Control Layer

Create a new WebView and set the URL to http://127.0.0.1:800/streetview/control . This displays the control screen showing a map and an orbit view. Both the map and orbit view can be used to navigate by clicking the arrows in the top view or by clicking a new position on the map.

...

This control screen can be displayed as a layer on the ICE canvas. The URL is http://127.0.0.1:9070/control A location can also be entered in the search text box above the orbit view. Use Edit mode to resize and position the control layer to a suitable area of the canvas, on top of the StreetView panorama layer.

...

Info

The StreetView Control page can also be accessed in Igloo Control Panel. Go to the Apps tab and click the StreetView icon to load.

Additional StreetView Layers

The other available endpoints are:

http://127.0.0.1:9070800/streetview/mapview - displays the streetview map with pegman

http://127.0.0.1:9070800/streetview/orbitview - displays the streetview panorama in a click-drag view

Tip

Exercise: add two WebView layers to display the streetview map and orbitview on top of the main iglooview.

...

Info

TIP: Save the layers together to create a new Streetview session which includes the control layers.

Next Section: Canvas UI - Using the Matterport App