Map Display

Primeros pasos

Importar la API Javascript

La API Javascript de Maplink está disponible públicamente en la url https://maps.maplink.global, y puede incluirse en cualquier página web fácilmente con una tag script:

<script src="https://maps.maplink.global"></script>

Crear objeto mapa

Con la API ya importada, todo lo que tiene que hacer para representar un mapa es definir un elemento div en su página y crear una instancia de la clase MaplinkMap asociada a este elemento.

El constructor de la clase espera dos argumentos obligatorios: la clave api de Maplink (client_id utilizado para autenticar las APIs), y el id del elemento div donde se renderizará el mapa.

<div id="map"></div>
<script>
const apiKey = "[CHAVE DE API]";
const maplink = new MaplinkMap(apiKey, "map");
</script>

Opcionalmente, se puede pasar un tercer argumento de configuración al construir el mapa. Este argumento debe ser un objeto, donde cada propiedad corresponde a una definición de configuración.

Las opciones disponibles son:

  • renderType – Acepta los valores de cadena "pbf" y "png". Selecciona el formato en el que el servidor enviará los mosaicos del mapa. Por defecto, el formato es protobuf (pbf), que utiliza la función de aceleración de gráficos del navegador a través de la API WebGL. En entornos sin soporte WebGL, la opción png debe estar activada, de lo contrario el mapa no podrá ser renderizado.
  • center – Objeto de coordenadas que define el punto central en la representación inicial del mapa.
  • zoom – Un número que define el nivel de zoom inicial. Este valor se pasa directamente a la instancia de leaflet asociada al mapa. Encontrará más información en el enlace: Zoom levels – Leaflet.