Select by OriginalSerial

Live example

In this tutorial you will learn how to select an element on the map using an original serial (ID) - not by clicking. This might be necessary if you want to embed a specific section of the map in another web view, for example linking an exhibitor’s details view to a map showing his location on the venue.

Add select function

  1. After creating a web map, as outlined in Getting started, you can call the select method in the map init success callback:

    Code

    ...
    map.setMapViewControllerDidStart(function () {
        selectFeatureByOriginalSerial();
    });
...

  2. This select function has to be previously defined, as shown here:

    Code

    function selectFeatureByOriginalSerial () {
    var originalSerial = "<your id>";
    map.selectFeatureByOriginalSerial(originalSerial, true, true);
}

  3. Add this HTML and CSS to achieve an ideal map view:

    Code

    <style type="text/css">
    body {
        width:600px;
    }
    #deepMap {
        width:598px;
        height:400px;
        border: 1px solid green;
    }
    #info {
        padding: 0 0 0 10px;
        height: 30px;
        line-height: 30px;
        border: 1px solid red;
    }
</style>

<body>
    <div id="deepMap"></div>
    <div id="info">Stand-Info</div>
</body>

  4. That’s it! Now you are able to select an element on the map by ID.