[Wiki] Mapea 4 - GeoJSON

by alfmartss

HTML

<script src="http://mapea4-sigc.juntadeandalucia.es/js/mapea.ol.min.js"></script>
<link rel="stylesheet" href="http://mapea4-sigc.juntadeandalucia.es/assets/css/mapea.ol.min.css">
<script src="http://mapea4-sigc.juntadeandalucia.es/js/configuration.js"></script>
  <input type="button" onclick="cambioPuntos()" value="Cambiar Puntos" />
<div id="map"></div>

CSS

html,
body,
#map {
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
}

JavaScript

var datosPlazas = [
      { "type": "Feature",
        "name": "Plaza 1",
        "geometry": { "type": "Point", "coordinates": [-2.2420028654298223, 36.78043531464472] },
        "properties":   {
          "Puesto":"00597038 - EDUCACION SEC",
            "Centro":"04001345 - C.E.I.P. Virgen del Mar",
             "F. Prevista Cese": "Sin determinar", "Tipo":"Sustitución", "Nº Plazas":2, "Participación": "Voluntaria",
            "Observaciones":"CENTRO VOLUNTARIO"
          }
      },
      { "type": "Feature",
        "name": "Plaza 2",
        "geometry": { "type": "Point", "coordinates": [-2.1097029335679735, 36.7604265525936] },
        "properties":   {
          "Puesto":"00597038 - MATEMATICAS",
            "Centro":"04003378 - C.E.I.P. San José",
            "F. Prevista Cese": "Sin determinar", "Tipo":"Sustitución", "Nº Plazas":1, "Participación": "Voluntaria",
            "Observaciones":"CENTRO VOLUNTARIO"
          }
      },
      { "type": "Feature",
        "name": "Plaza 3",
        "geometry": { "type": "Point", "coordinates": [-5.971697801, 37.387540913] },
        "properties":   {
            "Puesto":"00597040 - fisica y quimica",
            "Centro":"41004514 - C.E.I.P. Borbolla",
             "F. Prevista Cese": "Sin determinar", "Tipo":"Sustitución", "Nº Plazas":1, "Participación": "Voluntaria",
            "Observaciones":""
          }
      }
    ];
    
    var mapajs = M.map({
    container:"mapa",
    wmcfiles:["callejero"],
    controls: ["mouse","scale","location", "navtoolbar"]
    });
  //style manager para modificar dinamicamente los estilos de la capa.
  // quitar cuando se tengan claros los estilos que se quieren.
  mapajs.addPlugin(new M.plugin.StyleManager());


  //Capa GeoJSON local con las plazas ofertadas o plazas a seleccionar.
  var layerPlazas = creaCapaPlazas(mapajs);

  function creaCapaPlazas(mapa) {
    var nuevaCapaPlazas = new M.layer.GeoJSON({
       name: "plazas ofertadas",
       source:  {  "crs":...