Component Mapa



Descripció


És un component web per inserir un element mapa en qualsevol pàgina web i editar una geometria (punts, línies, polígons i rectangles). Consulta una demostració del component des de: Demo component mapa

Instal·lació i us

Pas 1: afegir referències web

Cal afegir les referències web a la pàgina on volem utilitzar el component


  <link rel="stylesheet" href="//geoportal.reus.cat/app-mapcomponent/v1/mapia-reus-geom.min.css" crossorigin=""/>
  <script src="//geoportal.reus.cat/app-mapcomponent/v1/mapia-reus-geom.min.js" crossorigin=""></script>

            

Pas 2: crear contenedor

Hem de crear l'element DIV on volem ubicar el mapa en la pàgina web.


  <div id="mapid" style="width: 100%; height: 600px;"></div>

            

Pas 3: definir objecte

Definir l'objecte javascript i definir geometria inicial


  // creem objecte per gestionar geometries, indiquem el div on volem ubicar el mapa
  mapia = new MapiaReusGeom('mapid');
  // inicialitzem geometria inicial (valor: point, linestring, polygon o rectangle)
  mapia.setGeometryType('point')

            

Funcionalitats

Exemple amb totes les funcionalitats de la API


  // modificar el tipus de geometria actual
  mapia.setGeometryType('point')

  // eliminar la geometria dibuixada actual
  mapia.clearGeometry()

  // zoom sobre la geometria actual
  mapia.zoomTo()

  // obtenir una cadena de text WKT amb el valor de la geometria
  let wktGeom = mapia.getGeometry()

  // dibuixar la geometria des d'una cadena de text WKT
  let wktGeom = 'LINESTRING(1.09717905 41.15685546,1.10553681 41.15762285,1.10553681 41.15762285)'
  mapia.setGeometry(wktGeom)