My Site LogoWemap Documentation

How create a single point map ?

1. Create your empty map on pro.getwemap.com and get your emmid & token

image

2. Add snippet to your website

Include CSS rules and JavaScript library on top of your HTML file.

<style>
    body, html{ height: 100%; }
</style>
<script type='application/javascript' src='https://livemap.getwemap.com/js/sdk.min.js'></script>

Include the following code in the <body> of your HTML file.

<div id='map-container' style='width: 100%; height: 100%;'></div>

3. Create point and map

Nexts steps are:

  • Create map
  • Create your Pinpoint from data
  • Center & zoom to your Pinpoint
<script>
    // Create your map
    var container = document.getElementById('map-container');
    var options = {
        emmid: 7439,
        token: 'Y6TBX2RX7HUP21XCCMFNHM6AV'
    };
    var livemap = wemap.v1.createLivemap(container, options);
    // Create your Pinpoint from data
    var myPoint = {
        id: 1,
        name: 'Wemap Office',
        latitude: 43.609138,
        longitude: 3.884193,
        description: 'Where magic happens',
        image_url: 'https://api.getwemap.com/images/pps-categories/icons_mood-rocket.png',
        type: 1
    };
    // Add your Pinpoint to the map (don't forget to include it in array)
    livemap.setPinpoints([myPoint]);
    // Center & zoom to your Pinpoint
    var center = {
        longitude: myPoint.longitude,
        latitude: myPoint.latitude
    };
    var zoom = 10;
    livemap.centerTo(center, zoom);
</script>

4. Et voilà !