How to integrate indoor navigation functionality into HTML5 (e.g. Cordova) applications


We offer a plugin that supports native navigation inside HTML5 (Cordova) apps.

The package contains  a zip containing the plugin itself (




1. Download and unzip both archives to a desired location
2. Change directory to the Cordova_app_location/plugins/
3. Install the plugin via command

cordova plugin add --link ../plugins/vanillanav-cordova-plugin

cordova platform add androidcordova platform add ios

cordova run 


 At this stage the app should be built and contain the plugin seen in the "plugins" folder of your app.

4. For iOS you need to add the framework in Embedded Binaries:


5. Add code that will call the plugin:

cordova.exec(function(data) {alert(data)},// success callback

function(err) {alert(err);}, // fail callback

"VanillaNavPlugin", // Name of the plugin

"save", // method called

[venueId]); // the Id of your venue6. Rebuild the app and run it


Available methods



opens another activity that saves the first marker it sees. Saving again will overwrite the last save


calls the success callback setting the data parameter to the id of the marker that was saved. If no marker was saved, it will set the data parameter to -1


navigates to the saved location. If no marker was set, the activity starts but no

navigation is displayed


deletes the saved marker


All methods require the venue id argument.


You can get the venue id from the vanillaNAV Manager. Enter the venue edit mode and you will see the venue id at the end of the address in the browser address bar. The below image shows an example where the venue id is 12103.










 The plugin needs to download navigation data first time and it will write that data on the phone in private mode. At first usage internet access is necessary.


Tags: Cordova, HTML5, integration
Last update:
2017-08-03 15:28
Marlene Lange
Average rating: 1 (1 Vote)

You cannot comment on this entry

Chuck Norris has counted to infinity. Twice.