Examples

Edit In Codpen
<!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>