getting-started/10.html

﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Añadiendo marcadores</title>
</head>
<body>
    <script src="//sitna.navarra.es/api/"></script>
    <div id="mapa"></div>
    <script>
        const myMap = new SITNA.Map("mapa", {
            baseLayers: [
                SITNA.Consts.layer.MAPBOX_SATELLITE,
                SITNA.Consts.layer.MAPBOX_STREETS,
                SITNA.Consts.layer.CARTO_LIGHT,
                SITNA.Consts.layer.CARTO_DARK
            ],
            crs: "EPSG:3857",
            initialExtent: [-8916022, 3179736, 9869141, 11789603],
            workLayers: [
                {
                    id: "paises",
                    type: SITNA.Consts.layerType.WMS,
                    url: "https://bio.discomap.eea.europa.eu/arcgis/services/Internal/Basemap_EEA38_WM/MapServer/WMSServer",
                    layerNames: ["3"],
                    title: "Países del mundo"
                },
                {
                    id: "rios",
                    type: SITNA.Consts.layerType.VECTOR,
                    url: "//sitna.github.io/getting-started/data/rivers.kml",
                    title: "Ríos"
                },
                {
                    id: "capitales",
                    type: SITNA.Consts.layerType.VECTOR,
                    format: SITNA.Consts.mimeType.GEOJSON,
                    url: "//sitna.github.io/getting-started/data/capitals.json",
                    title: "Capitales del mundo"
                }
            ],
            controls: {
                TOC: false,
                workLayerManager: {
                    div: "toc"
                }
            }
        });

        // Esperamos a que el mapa se cargue
        myMap.loaded(() => {
            // Añadimos marcadores
            myMap.addMarker([-203288, 6652999]);
            myMap.addMarker([1390641, 5144550]);
            myMap.addMarker([677254, 6581543]);
            myMap.addMarker([-399432, 4463713]);
            myMap.addMarker([-720856, 7112550]);
            myMap.addMarker([2641252, 4575413]);
            myMap.addMarker([236074, 6241789]);
        });
    </script>
</body>
</html>