Sign in

3D Wayfinder Integration

3D Wayfinder’s modular architecture makes implementing new features easy and supports integration with 3rd party software.

When creating 3D Wayfinder, we have followed the principles that each customer would like to customize their application and integrate it with other applications, including Digital Signage software. Therefore we have built an open architecture with easily customizable user interface.


Template customization

3D Wayfinder user interface (UI) is based on HTML5 which makes it possible to create a modern dynamic lay-out for wayfinding application. Each customer can have it’s own custom layout, but all the existing layouts can also be customized, including colors, fonts, font sizes etc. We also provide a layout parameter editor in our Administration Panel by using CSS pre-processor Less.js
A layout is basically set-up by the same way as CMS systems use website templates. Layouts set how buttons, links, text etc will look. Where menus, the map and other elements are positioned.
Our newer templates are responsive templates, which means, that they are convenient to use on large kiosk displays and also on smartphone screens.
As templates are basically HTML-pages, it is possible to include external content from other websites or web-applications.


Including external content in 3D Wayfinder

Usually building managers would like to include information from external sources, like

In wayfinder templates it is possible to specify in what conditions and where this info will be shown. POI-related info can be shown only in POI detail info etc and we can also query POI-related info from other web-sites and applications.


Integrating social media content

One of the most common integration is showing social media content in wayfinding applications. As shopping malls and other public building usually have their news already on Twitter, they would likwayfinder_social_media_integratione to include the news feed also in wayfinding.
Integrating Facebook or Twitter feed is basically the same, as integrating them to any other web-page. The only thing is that in kiosk you don’t want the end-users to click on the links and navigate away from the wayfinding system. This will also protect the underlying system from malicious software and users.


System Architecture

3D Wayfinder UI uses:3D_Wayfinder_Architecture_Schema

3D Wayfinder map component provides a Javascript API for getting events from the map and for controlling the map.
With Javascript API, it is possible to:

3D Wayfinder map component API also includes 3D Wayfinder data API.
Data API provides:

You can find 3D Wayfinder API documentation under Docs section.

3D Wayfinder application server is using PHP to provide the JSON API and each project resides in it’s own database (MySQL and CouchDB).

The JSON API divided in two:

There are also background services and tools that use Python and Node.js. The application server is usually run on a Linux machine (Ubuntu/Debian), but can also be set-up on other operating systems with some additional effort.


3D Wayfinder is the world’s first WebGL based wayfinder

WebGL is plug-in free, memory management is handled automatically and it is royalty free web standard for low-level 3D graphics. WebGL is supported in most of the operating systems (Windows Vista or later, Mac OS 10.6 or later, Linux and Chrome OS) and browsers. There are no minimum requirements in terms of system specs. System needs a Graphics processing unit (GPU) which is capable of processing shaders (DX9 level) but that basically describes every device with a GPU these days.
You can see our browser performance tests with WebGL in our blog.

WebGL canvas can be mixed with other HTML elements and integrated according to the personal needs in combination with other technologies and contents. That means it is a very flexible solution and its uniqueness is based on the technology. WebGL offers endless possibilities for designers and developers. It is the best solution, enabling to display 3D content on every browser and platform.


Integrating 3D Wayfinder to other applications

3D Wayfinder map component can be easily embedded in any web-based application. See the tutorial how to embed 3D floor plan into HTML documents.

3D Wayfinder uses it’s own Open Source WebGL engine FRAK. FRAK engine is a JavaScript library/API for creating interactive 3D applications using WebGL, specially for showing dynamic 3D architectural content with meta data. FRAK is Open Source and it is available from Github repository.
To add more complex features to 3D Wayfinder map part we can add additional components and shaders to the FRAK engine. This enables us to create complex animations, visual effects and functionality.


Javascript SDK

3D Wayfinder JavaScript SDK documentation is accessible from documentation page.
The API has a single entry point from the Wayfinder class. This will provide different types of event callbacks and data objects. The API will load all necessary data and has events to keep eye on the process.
Developers have access to events such as: clicks on the map, floor changing, language changes etc.
Also it is possible to trigger path showing, floor changes, highlighting different locations and so on.
It is possible to access all data from the API and also change it temporary. Every location can have a external ID for linking if other 3rd party systems.


Changing data from 3rd party software

It is possible to change data programmatically through our private API. For example it is possible to change:


Indoor and outdoor positioning

We have extended 3D Wayfinder application with different types positioning systems:

This gives the platform possibility to use the platform on smartphones and give the users a easy way to position them indoors which isn’t possible with regular mapping services.

Sign up for free account