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>
<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,
service_id :1,
key: 'Please enter your key'
}
)
// Line Path
let line = [
{lng: 100.501833,lat: 13.753815},
{lng: 100.515385,lat: 13.761620},
{lng: 100.520447,lat: 13.757369},
{lng: 100.523419,lat: 13.756212},
{lng: 100.541163,lat: 13.749868},
{lng: 100.554459,lat: 13.749977}
]
// Polyline
let polyline = new fatosmap.maps.Polyline({
path: line, // latlng Must
strokeColor: '#0000FF', // optional
strokeOpacity: 1, // optional
strokeWeight: 8 // optional
});
polyline.setMap(mapInstance)
</script>
<style>
</style>
</body>
</html>