Vici.org

The Vici.org map is available as a javascript widget and can be included on any web page. Just follow three steps.

1. Include the required libraries

The Vici widget requires a stylesheet and three libraries to run. These are OpenLayers, jQuery and of course the Vici library. Include these libraries in your page by adding the following code between the <head>-tags of the page:

<link rel="stylesheet" href="https://openlayers.org/en/v4.6.5/css/ol.css" type="text/css">
<script src="https://openlayers.org/en/v4.6.5/build/ol.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://vici.org/js/vici.js"></script>

2. Determine where the map should be shown

Reserve a place on the page for the map by adding a <div>-tag with the desired layout. Give this element an id, for example "map". Here is an example:

<div id="map" style="width:600px; height:400px; position:relative"></div>

3. Activate the widget

Activate the widget by putting the following code on the bottom of the page, just before the </body>-tag:

<script type="text/javascript">
var mapObj = new ViciWidget('map', {});
</script>

Use the id of the element you want the map to be shown. See a live demo of this example.

The widget can be customized in many ways. See for example the implementation by Livius. Please contact for more instructions.