Picking buildings

Highlight buildings by clicking on them.
<!DOCTYPE HTML>
<html>
  <head>
    <script src="https://unpkg.com/wrld.js@1.x.x"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.1/leaflet.css" rel="stylesheet" />
  </head>
  
  <body>
  <div style="position: relative">
    <div id="map" style="height: 400px"></div>
    <script>
        var map = Wrld.map("map", "your_api_key_here", {
            center: [37.795641, -122.404173],
            zoom: 18
        });

        var _mouseDownPoint = null;

        map.on("mousedown", onMouseDown);
        map.on("mouseup", onMouseUp);

        function onMouseDown(event) {
            _mouseDownPoint = event.layerPoint;
        }

        function onMouseUp(event) {
            var mouseUpPoint = event.layerPoint;
            var mouseMoved = mouseUpPoint.distanceTo(_mouseDownPoint) > 5;

            if (!mouseMoved) {
                var result = map.buildings.findBuildingAtScreenPoint(event.layerPoint);
                if (result.found) {
                    var buildingHighlight = Wrld.buildings.buildingHighlight(
                        Wrld.buildings.buildingHighlightOptions()
                            .highlightBuildingAtScreenPoint(event.layerPoint)
                            .color([255, 255, 0, 128])
                        )
                        .addTo(map);

                    setTimeout(function() {
                        buildingHighlight.remove();
                    }, 4000);
                }

            }
        }
    </script>
  </div>
  </body>
</html>