Deep Map SDK Web
The objective of this tutorial is to show the interaction between a list of objects and the map. When clicking an object in the list or on the map, the map moves to the selected object and an annotation is generated which displays the level and the name of the selected object.
Step 1: init the map
You have created a map, as outlined in "A Map Application".
Step 2: add the list
Step 3: add a click event to the list
This example shows the implementation of the click event with the help of jQuery and the readout of the original serial and the icon.
Step 4: add selected feature and move to it
A click on the list loads the feature from the server.
Mark the feature as selected.
Step 5: add custom annotation
Create a DOM element for the annotation and add it to the map.
Delete the old annotation before creating a new one.
Add this CSS to style the annotations.
Step 6: add click handler
A click handler is necessary to remove labels and annotations while clicking on the map.