[Test] MVT 3857

by Francisco

HTML

<link rel="stylesheet" href="https://mapea4-sigc.juntadeandalucia.es/assets/css/mapea-5.1.0.ol.min.css">
<script src="https://mapea4-sigc.juntadeandalucia.es/js/mapea-5.1.0.ol.min.js"></script>
<script src="https://mapea4-sigc.juntadeandalucia.es/js/configuration-5.1.0.js"></script>
<div id="map"></div>

CSS

html,
 body {
   margin: 0;
   padding: 0;
   height: 100%;
   overflow: hidden;
 }

JavaScript

let mvt = new M.layer.MVT({
  url: 'https://cdn.digitransit.fi/map/v1/hsl-vector-map/{z}/{x}/{y}.pbf',
  name: 'vectortile',
  projection: 'EPSG:3857',
});


/*let mvt = new M.layer.MVT({
  url: 'https://a.tiles.mapbox.com/v4/mapbox.mapbox-streets-v6/' +
            '{z}/{x}/{y}.vector.pbf?access_token=' + M.config.MAPBOX_TOKEN_VALUE,
  name: 'vectortile',
  projection: 'EPSG:3857',
});*/


let mapa = M.map({
  container: 'map',
  getfeatureinfo: 'plain',
  controls: ['mouse', 'layerswitcher'],
  projection: 'EPSG:3857*m', //CASO EPSG:4326 'EPSG:4326*d',
  layers: ['OSM'],
});


mapa.addLayers(mvt);

// Para activar funcionalidad take me there
M.Popup.options.takeMeThere = true;


// Para cambiar al modo con icono
// M.Popup.options.textMode = false;

// Para cambiar el texto
// M.Popup.options.msg = 'Take me there.'