Raster object
To add a raster to the map, specify the required bounds and image.
const raster = new mapgl.Raster(map, {
bounds: {
southWest: [55.281050902571224, 25.212929864063227],
northEast: [55.35650909743233, 25.258745846312053],
},
image: {
url: `https://docs.2gis.com/img/mapgl/cloud.png`,
},
});
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>2GIS Map API</title>
<meta name="description" content="Raster object example" />
<style>
html,
body,
#container {
margin: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
</style>
</head>
<body>
<div id="container"></div>
<script src="https://mapgl.2gis.com/api/js/v1"></script>
<script>
const map = new mapgl.Map('container', {
center: [55.308, 25.237],
zoom: 14,
key: 'Your API access key',
});
const raster = new mapgl.Raster(map, {
bounds: {
"southWest": [
55.281050902571224,
25.212929864063227
],
"northEast": [
55.35650909743233,
25.258745846312053
]
},
image: {
url: `https://docs.2gis.com/img/mapgl/cloud.png`,
},
opacity: ['interpolate', ['linear'], ['zoom'], 10, 0.1, 14.5, 0.8, 16, 0.1]
});
</script>
</body>
</html>