Maps

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

Property

Description

Remarks

zoom

The zoom value is the zoom in/out value of the map. Not the required input.

optional

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.

optional

minZoom

Minimum zoom value. Not required value.

optional

key

Authentication value for map use. Required input value.

must

buttonBox

Set map control box visibility on map instance initialization. Setting this option as "false" would hide the control box. Default: "true".

optional

Example

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

</div>
<script type="text/javascript" src="https://maps.mogoscorp.com/..."></script>
<script>
    let LatLng = {lat: 37.482890, lng: 126.896086}
    let mapInstance = new mogosmap.maps.Map(
        document.getElementById("app"),
        {
            zoom: 14,
            center: LatLng,
            maxZoom: 20,
            minZoom: 2,
            key: 'YOUR_API_KEY'
        }
    )
</script>
</body>
</html>

PreviousOverview NextMap Control

Last updated 2 years ago

Maps

Property

Description

Remarks

zoom

The zoom value is the zoom in/out value of the map. Not the required input.

optional

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.

optional

minZoom

Minimum zoom value. Not required value.

optional

key

Authentication value for map use. Required input value.

must

buttonBox

Set map control box visibility on map instance initialization. Setting this option as "false" would hide the control box. Default: "true".

optional

Example

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

</div>
<script type="text/javascript" src="https://maps.mogoscorp.com/..."></script>
<script>
    let LatLng = {lat: 37.482890, lng: 126.896086}
    let mapInstance = new mogosmap.maps.Map(
        document.getElementById("app"),
        {
            zoom: 14,
            center: LatLng,
            maxZoom: 20,
            minZoom: 2,
            key: 'YOUR_API_KEY'
        }
    )
</script>
</body>
</html>

The MOGOS Maps API requires an API Key, which can be obtained from the website or contact .

PreviousOverview NextMap Control

Last updated 2 years ago