Skip to content
English
More support Support Portal
Contact us
  • There are no suggestions because the search field is empty.

Upgrading from Web Map 1.0

Version 2 of the web map is mostly backwards compatible; however, the User Interface (UI) has been decoupled from the map renderer and API. We provide a default user interface; however, the scripts need to be installed separately.

 Add the UI script: 

-<script src="https://cdn.wayfinder.acquiredigital.com/live/js-api/wf.js"></script> 
+<script src="https://cdn.wayfinder.acquiredigital.com/live/js-api/three.min.js"></script> 
+<script src="https://cdn.wayfinder.acquiredigital.com/live/js-api/wayfinderv2.js"></script> 
+<script src="https://cdn.wayfinder.acquiredigital.com/live/js-api/wf-map-ui.js" 
type="module"></script>

 Use the new UI custom element to wrap the map anchor: 

-<div id="wayfinderMap"></div> 
+<wf-map-ui id="wayfinderUI"> 
+  <div id="wayfinderMap"></div> 
+</wf-map-ui>

 Initialise Wayfinder and pass in the UI: 

const settings = { -  apiKey: 1234-5678 }  
-ACQ.init(document.getElementById("wayfinder-map"), settings) 
+var wayfinderInstance = new Wayfinder(document.getElementById("wayfinderMap"), settings); 
+const uiElement = document.querySelector('wf-map-ui'); 
+uiElement.wayfinder = wayfinderInstance; 
+wayfinder.loadFromApiKey('1234-5678')

Example

As an example, here is a V1 web map: 

Codepen

And here is the same map upgraded to V2: 

Codepen