FATOS API

Map

FATOS MAP is..

FATOS map is a JavaScript library that uses WebGL to rendering maps while interacting with users in a vector tile type.

Description

The Map object represents a map of the screen. It provides methods and properties for programmatically changing the map and Generate an event when the user interacts with it. Mapinstance creates map by specifying containers and other options.

Key issue for using maps

To use the FATOS map API, you need an API key. API key is unique identifier used to authenticate requests related to a project for use and billing purpose. Please contact FATOS Salse Group for any questions to use the key(sales@fatoscorp.com).

Parameter

options

Name Description Optional
zoom The zoom value is the zoom in/out value of the map. Not the required input. option
center Center is coordinate value that will be displayed to the center at the first loading of the map and is a required input. must
maxZoom Maximum zoom value. Not required value. option
minZoom Minimum zoom value. Not required value. option
key Authentication value for map use. Required input value. must
zoomControl The value of the button to adjust the zoom level value of the map. Not required value. option
draggable Whether the marker on the map can be moved to the desired location. Not required value. option
rotateControl This option lets you interact with the rotation of the map by dragging it. Not required value. option
tilt The slope of the map. The range from 0 to 60 and the initial value is zero(0). option

Example

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>FATOS Map</title>
</head>
<body>
<div style="height: 100vh;">
    <div id="app"></div>

</div>
<script type="text/javascript" src="https://maps.fatos.biz/dist/fatosmap-gl.js"></script>
<script>
    let LatLng = {lat: 1.28516, lng: 103.84738}
    let map = new fatosmap.maps.Map(
        document.getElementById("app"),
        {
            zoom: 14,
            center: LatLng,
            maxZoom: 20,
            minZoom: 2,
            scrollwheel: true,
            scaleControl: true,
            fullscreenControl: true,
            zoomControl: false,
            draggable: true,
            rotateControl: true,
            key: 'YOUR_API_KEY'
        }
    )
</script>
</body>
</html>

Bounds →