agentscript/maplibre/rectscreen.html at master · backspaces/agentscript · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<html>

<head>
    <title>RectScreen</title>
</head>

<body>
    <div id="map"></div>
    <script type="module">
        import * as mltools from './mltools.js'

        // ===== Start of map & layers

        const map = await mltools.newMap(mltools.santaFeCenter, 10)

        mltools.addRasterLayer(map, 'terrain', mltools.terrain('usgs'))

        const bbox = mltools.mapbbox(map)

        // Create a rect layer of the window's bbox
        mltools.addGeojsonLayer(map, 'rectangle', bbox, 'rgba(255, 0, 0, 0.2)', 'red', 3)

        // update geojson layer above wnenever the map changes
        const update = (map, bbox) => mltools.updateGeojson(map, 'rectangle', bbox)
        mltools.mapListener(map, update)

        // ===== End of map & layers
    </script>
</body>

</html>