On/Off
Event detection
on / off
Adds or removes a listener for a specific event on a given layer.
// Adds a listener
mapInstance.on(type, layerId, listener);
// Removes a listener
mapInstance.off(type, layerId, listener);
Parameter
Example(Javascript + HTML)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Map Event</title>
</head>
<body>
<div style="height: 100vh">
<div id="app"></div>
<pre id="info"></pre>
</div>
<button style="position: absolute; float: top; top: 50px; left: 50px;" onclick="mapClick()">On map Click</button>
<button style="position: absolute; float: top; top: 50px; left: 150px;" onclick="mapClickoff()">OFF map Click</button>
<style>
#info {
display: block; position: absolute; float: top; top: 0; left: 30%;
width: 50%; padding: 10px; border: none; border-radius: 3px; font-size: 12px;
text-align: center; color: #222; background: #fff;
}
</style>
<script type="text/javascript" src="https://maps.fatos.biz/dist/fatosmap-gl.js"></script>
<script>
const LatLng = {lat: 37.482901, lng: 126.896038};
let mapInstance = new fatosmap.maps.Map(
document.getElementById("app"),
{
zoom: 14.5,
center: LatLng,
maxZoom: 20,
minZoom: 2,
key: 'YOUR_API_KEY',
}
);
function mapClick() {
mapInstance.on('click', clickEvent);
}
function clickEvent(e) {
console.log('click', e);
document.getElementById('info').innerHTML = JSON.stringify(e.lngLat);
}
function mapClickoff() {
mapInstance.off('click', clickEvent);
}
</script>
</body>
</html>
Last updated