Continúo con la serie de Mashups con Open Data Euskadi. En este caso cargo en Google Maps los datos obtenidos a través de un WMS (Web Map Service).
El mapa resultante muestra zonas que soportan o han soportado actividades o instalaciones potencialmente contaminantes del suelo en la Comunidad Autónoma del País Vasco.
Los datos:
Obtenidos de Open Data Euskadi (Geo Euskadi):
“Mapa del Inventario de suelos que soportan o han soportado actividades o instalaciones potencialmente contaminantes del suelo en la Comunidad Autónoma del País Vasco a escala 1:25.000 (año 2008).
La metodología utilizada para la elaboración del inventario se ha basado principalmente en la recopilación de información de las fuentes documentales municipales y supramunicipales, visitas de campo y entrevistas personales con técnicos y técnicas municipales con la finalidad, todo ello, de identificar y localizar las actividades potencialmente contaminantes del suelo y obtener datos sobre ellas.”
Código completo:
Para la visualización de datos superponemos la capa de datos con la llamada oportuna al WMS como se ve en el código:
<!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 0px; padding: 0px } #map_canvas { height: 100% } </style> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"> </script> <script type="text/javascript"> var map; //Define custom WMS tiled layer var SLPLayer = new google.maps.ImageMapType({ getTileUrl: function (coord, zoom) { var proj = map.getProjection(); var zfactor = Math.pow(2, zoom); // get Long Lat coordinates var top = proj.fromPointToLatLng(new google.maps.Point(coord.x * 256 / zfactor, coord.y * 256 / zfactor)); var bot = proj.fromPointToLatLng(new google.maps.Point((coord.x + 1) * 256 / zfactor, (coord.y + 1) * 256 / zfactor)); //corrections for the slight shift of the SLP (mapserver) var deltaX = 0; var deltaY = 0; //create the Bounding box string var bbox = (top.lng() + deltaX) + "," + (bot.lat() + deltaY) + "," + (bot.lng() + deltaX) + "," + (top.lat() + deltaY); //base WMS URL var url = "http://www.geo.euskadi.net/WMS_INGURUMENA?"; url += "&REQUEST=GetMap"; //WMS operation url += "&SERVICE=WMS"; //WMS service url += "&VERSION=1.1.1"; //WMS version url += "&LAYERS=4"; //WMS layers url += "&FORMAT=image/png"; //WMS format url += "&BGCOLOR=0xFFFFFF"; url += "&TRANSPARENT=TRUE"; url += "&SRS=EPSG:4326"; //set WGS84 url += "&BBOX=" + bbox; // set bounding box url += "&WIDTH=256"; //tile size in google url += "&HEIGHT=256"; url += "&STYLES=default"; return url; // return URL for the tile }, tileSize: new google.maps.Size(256, 256), isPng: true }); function initialize() { var mapOptions = { zoom: 10, center: new google.maps.LatLng(43.034768, -2.620239), mapTypeId: google.maps.MapTypeId.TERRAIN }; map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); //add WMS layer map.overlayMapTypes.push(SLPLayer); //Show logo var logoDiv = document.createElement('DIV'); logoDiv.innerHTML = '<a href="http://clevermaps.info" target="_blank"><img src="http://clevermaps.s3.amazonaws.com/images/cleverMapsLogoBlack.png" style="width: 250px" border=0/></a>'; logoDiv.index = 1; map.controls[google.maps.ControlPosition.BOTTOM_LEFT].push(logoDiv); } </script> </head> <body onload="initialize()"> <div id="map_canvas" style="width:100%; height:100%"></div> </body> </html>
#1 por Juan Carlos el 18 febrero, 2013 - 4:47 pm
Hola,
He visto tu ejemplo de emplear la api de google con los WMS de geoEuskadi. Está genial.
Sin embargo la información sale desplazada. Intentaré averiguar cuál es la razón, quizás sea un problema de la configuración del WMS de geoeuskadi, puesto que hasta la fecha lo hemos empleado sobre todo 25830 y 23030.
Estaría muy bien dar con el problema, porque de esta forma cualquier información de los WMS de geoeuskadi saldrá desplazada. Intentaré averiguar si es problema del WMS de http://www.geo.euskadi.net
un saludo.
#2 por belensaez el 19 febrero, 2013 - 9:47 am
Muchas gracias Juan Carlos. Me alegra te haya gustado el ejemplo. Saludos, Belén.
#3 por Juan Carlos el 20 febrero, 2013 - 12:53 pm
Hola Belén,
Al final pasé la consulta a http://www.geo.euskadi.net
Al parecer la transformación del WMS a latitud, longitud (4326) era errónea y por eso se desplazaba.
Han republicado el servicio WMS de INGURUMENA, y ahora cuadra perfectamente.
Aunque para ello previamente debes poner a 0 los valores de deltaX y deltaY.
Tu mashup ha colaborado en mejorar el servicio de geoeuskadi.
un saludo.
#4 por belensaez el 21 febrero, 2013 - 9:25 am
Un placer haber sido de ayuda. El mapa y el código en el post han sido actualizado con los valores de deltaX y deltaY a 0.
Saludos.