Using the Marker Controller

Create and manipulate styled markers.

This is an optional component with a few dependencies. To use it, you will have to include JQuery, wrld.css and marker_controller.js as shown in the code sample below.

    <script src=""></script>
    <link href="" rel="stylesheet" />

    <link href="" rel="stylesheet"/>
    <script src=""></script>
    <script src=""></script>
  <div style="position: relative">
    <div id="map" style="height: 400px"></div>
      var map ="map", "your_api_key_here", {
        center: [37.7849, -122.4024],
        zoom: 17

      var markerController = new WrldMarkerController(map);

      // Markers must have unique ids
      var markerIds = [0, 1];
      var marker0 = markerController.addMarker(markerIds[0], [37.7856, -122.4027], { iconKey: "pin" });
      var marker1 = markerController.addMarker(markerIds[1], [37.7845, -122.4012], { iconKey: "aroundme" });

      marker0.on("click", function(e) { markerController.selectMarker(marker0); });
      marker1.on("click", function(e) { markerController.selectMarker(marker1); });