How to embed NavVis IVION into any website

Introduction

Purpose

This procedure describes how you can embed your NavVis IVION Instance into any website. For example, this enables visitors of your website to visit your office virtually or display your projects to the public.

Scope

This procedure describes the basics on how to embed your NavVis IVION instance into any website.

Pre-requisites

A NavVis IVION instance which is public and hosted on the NavVis Cloud.

Procedure

When integrating your NavVis IVION instance into your website, various options are available. Below, we outline the most straightforward methods:

Option 1 iFrame Embed

Embedding NavVis IVION as an iFrame into your existing website is the simplest option. This method only requires you to integrate the instance using an iFrame element, similar to embedding a YouTube video. The HTML code snippet for this process is:

<iframe src=“https://hq.iv.navvis.com/ “ height=“600″ width=“800″ name=“NavVis HQ Embed“> </iframe>

To display the content on your website, you must adjust the Cross-Origin Resource Sharing (CORS) settings. Refer to Configuring your Instance for instructions. After adjusting the CORS settings, your instance will be visible on your website.

Option 2 Frontend API

In addition to the iFrame option, you can utilize our Frontend API.

Note: Using the Frontend Application Programming Interface (API) requires advanced coding skills.

Regardless which option you choose, you must make your instance public if you want people visiting your website to be able to access your spatial data without having to login. The concept of making your instance and Site public is explained in Configuring your Instance.