Examples
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<div style="height: 500px; width: 500px">
<div id="app">
</div>
</div>
<button class = "btnfitBounds" onclick="fitBounds()">fitBounds
</button>
<button class = "btngetBounds" onclick="getBounds()">getBounds
</button>
<script src="https://maps.fatos.biz/dist/fatosmap-gl.js">
</script>
<script>
let LatLng ={lat: 13.753815, lng: 100.501833}
let mapInstance = new fatosmap.maps.Map(
document.getElementById("app"),
{
zoom: 11,
center: LatLng,
userId:2,
key: 'Please enter your key'
}
)
function fitBounds (){
let fit = {
sw: {lat: 13.708888, lng: 100.771124},
ne: {lat: 13.644634, lng: 100.713359}
}
let opt = {
top: 10,
bottom: 10,
right: 10,
left: 10
}
mapInstance.fitBounds(fit,opt);
};
function getBounds (){
var bounds = mapInstance.getBounds();
alert(bounds);
}
</script>
<style>
.btnfitBounds {
position: relative;
float: left;
left: 0px;
z-index:1;
}
.btngetBounds {
position: relative;
margin-left: 10px;
z-index:1;
}
</style>
</body>
</html>