Display an image map layer
You can display an image map layer from an image service. More information about Map Services can be found in the L.esri.ImageMapLayer documentation.
You can display an image map layer from an image service. More information about Map Services can be found in the L.esri.ImageMapLayer documentation.
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
32
33
34
35
36
37
<html>
<head>
<meta charset="utf-8" />
<title>Simple ImageMapLayer</title>
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" crossorigin="" />
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" crossorigin=""></script>
<!-- Load Esri Leaflet from CDN -->
<script src="https://unpkg.com/esri-leaflet@3.0.10/dist/esri-leaflet.js"></script>
<style>
html,
body,
#map {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #323232;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
const map = L.map("map").setView([37.75, -122.23], 10);
L.esri
.imageMapLayer({
url: "https://landsat.arcgis.com/arcgis/rest/services/Landsat/PS/ImageServer",
attribution: "United States Geological Survey (USGS), National Aeronautics and Space Administration (NASA)"
})
.addTo(map);
</script>
</body>
</html>Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.