[TEST] migración romero

by sigcJunta

HTML

<script src="https://sigc.desarrollo.guadaltel.es/mapea/js/mapea.ol.min.js"></script>
<link rel="stylesheet" href="https://sigc.desarrollo.guadaltel.es/mapea/assets/css/mapea.ol.min.css">
<script src="https://mapea4-sigc.juntadeandalucia.es/js/configuration.js"></script>
<button onclick="cargarDatos()">
  Cargar POI
</button>
<div id="map"></div>

CSS

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

JavaScript

let poiStyle = new M.style.Point({
  radius: 56,
  fill: {
    color: '#00cccc',
    opacity: 0.6
  },
  stroke: {
    color: '#0000cc',
    width: 1
  },
  label: {
    text: "hola",
    font: 'bold 9px arial',
    offsetY: -18,
    fill: {
      color: "#000"
    },
    stroke: {
      color: "#ffffff",
      width: 3
    }
  }
});

let lyPois = new M.layer.GeoJSON({
  name: 'Información',
  source: {
    "type": "FeatureCollection",
    "crs": {
      "type": "name",
      "properties": {
        "name": "urn:ogc:def:crs:EPSG:25830"
      }
    },
    "features": []
  }
}, {
  style: poiStyle
});

var mapajs = M.map({
  'container': 'map',
  "controls": ["layerswitcher"],
  "wmc": 'cdau',
  "layers": lyPois
});




function cargarDatos() {

  let fPoi = new M.Feature({
    "type": "Feature",
    "id": 164,
    "geometry": {
      "type": "Point",
      "coordinates": [341815, 4190051]
    },
    "properties": {
      "nombre": "Pernocta Polígono Amargacena",
      "hora de paso": "22:00"
    }
  });
  lyPois.addFeatures(fPoi);

  mapajs.setBbox(lyPois.getFeaturesExtent());
}