Puntos de interés en mapas dinámicos

1 UNIVERSITAT POLITÈCNICA DE VALÈNCIA ESCOLA TÈCNICA SUPERIOR D’INGINYERIA INFORMÀTICA PUNTOS DE INTERÉS EN MAPAS DINAMICOS PROJECTE FINAL DE CARRERA Titulació:Enginyer Tècnic en Informàtica de Sistemes Alumne: Vicente Javier Mozos Pérez Tutor Acadèmic: Alvaro Doménech Pujol 2 ÍNDEX 1. Introducció..............................................................................................................................7 2. Objectius ................................................................................................................................7 3. Descripció del problema.........................................................................................................8 3.1. Petició del client .................................................................................................... 8 3.2. Requeriments......................................................................................................... 8 3.3. Proposta de solució................................................................................................ 8 3.4. Esquema de l’aplicació........................................................................................ 10 4. Conceptes teòrics ................................................................................................................10 4.1. Introducció als sistemes d'informació Geogràfica (SIG)..................................... 10 4.1.1. Definició dels SIG........................................................................................ 11 4.1.2. Aplicacions dels SIG .................................................................................... 11 4.1.3. Components d’un SIG .................................................................................. 11 4.2. Capes en sistemas SIG......................................................................................... 12 4.3. Sistemes de referència......................................................................................... 12 5. sofware necessari................................................................................................................12 5.1. Elecció del sofware necessari.............................................................................. 12 5.2. Programari lliure.................................................................................................. 13 5.3. Programari no lliure............................................................................................. 13 5.4. Comparativa. Decisió final.................................................................................. 14 5.5. Programari necessari............................................................................................ 14 5.5.1. Editor de textos............................................................................................. 14 5.5.2. Apache.......................................................................................................... 15 5.5.3. Paquet MS4W............................................................................................... 15 5.5.3.1. Mapserver.............................................................................................. 15 6. Coneixements necessaris....................................................................................................16 6.1. HTML.................................................................................................................. 16 6.1.1. Conceptes bàsics d’HTML........................................................................... 16 6.1.2. Organització de les pàgines web .................................................................. 16 6.1.3. Llenguatge HTML........................................................................................ 17 6.1.4. Estructura d’un document HTML ................................................................ 17 6.2. MapServer ........................................................................................................... 18 6.3. PHP...................................................................................................................... 19 6.3.1. Funcionament PHP....................................................................................... 19 6.3.2. Avantatges de fer servir PHP........................................................................ 20 6.3.3. Conceptes bàsics de PHP.............................................................................. 20 6.3.3.1. Variables per valor i per referència ....................................................... 21 6.4. PHP MapScript.................................................................................................... 22 6.5. Base de dades ...................................................................................................... 24 6.5.1. Què són les bases de dades........................................................................... 24 6.5.2. Programes per treballar amb bases de dades ................................................ 25 6.6. PostgreSQL.......................................................................................................... 26 6.6.1. Llenguatge SQL............................................................................................ 26 6.6.2. Característiques de postgreSQL ................................................................... 27 6.7. Javascript............................................................................................................. 28 6.7.1. Com incloure Javascript ............................................................................... 29 7. Solució adoptada .................................................................................................................29 3 7.1. Preparació de la web............................................................................................ 29 7.1.1. Creació de la base de dades.......................................................................... 29 7.1.2. Capa auxiliar................................................................................................. 30 7.1.3. Àrees d’influència......................................................................................... 32 7.1.4. Inclusió de les capes “shp” a la base de dades ............................................. 32 7.1.5. Capa de dades. Vinculació de dues capes .................................................... 37 7.1.5.1. Preparació de la capa d’illes de cases.................................................... 37 7.1.5.2. Capa de dades complementària ............................................................. 38 7.1.5.3. Vinculació de les dues capes ................................................................. 40 7.1.6. Consulta........................................................................................................ 41 7.2. Desenvolupament de l’aplicació.......................................................................... 44 7.2.1. Elements necessaris...................................................................................... 44 7.2.2. Biblioteca de simbologia .............................................................................. 44 7.2.3. Biblioteca d’imatges..................................................................................... 45 7.2.4. Biblioteca de fonts........................................................................................ 46 7.2.5. Plantilla de disseny....................................................................................... 46 7.2.6. Arxiu map..................................................................................................... 48 7.2.6.1. Estructura de l’arxiu map ...................................................................... 48 7.2.6.2. Càrrega d’una capa “shp”...................................................................... 49 7.2.6.3. Càrrega d’una capa PostGIS.................................................................. 51 7.2.6.4. Càrrega d’una capa wms........................................................................ 53 7.2.7. Arxius “PHP” ............................................................................................... 55 7.2.7.1. Arxiu índex............................................................................................ 55 7.2.7.2. Arxiu principal....................................................................................... 56 7.2.7.3. Arxiu consulta ....................................................................................... 57 7.2.8. Arxius HTML............................................................................................... 58 7.2.8.1. Pàgines d’ajuda...................................................................................... 58 7.2.8.2. Sense dades............................................................................................ 59 7.2.9. Base de dades ............................................................................................... 60 7.2.9.1. localització de la base de dades............................................................. 61 7.2.10. Relació de tots els elements........................................................................ 61 8. Exemple pràctic....................................................................................................................64 8.1. Usuari autoritzat .................................................................................................. 64 8.2. Usuari no autoritzat ............................................................................................. 70 9. Problemes trobats................................................................................................................75 9.1. Càrrega capa wms................................................................................................ 75 9.2. Temps d’espera.................................................................................................... 75 10. Conclusions........................................................................................................................75 11. Futures línies de treball......................................................................................................76 12. Bibliografia .........................................................................................................................77 13. Anexo.................................................................................................................................79 13.1. Guia-esquema d’ instal·lació ............................................................................. 79 13.2. PostgreSQL i pgAdmin III ................................................................................ 80 13.2.1. Guia-esquema d’instalació ......................................................................... 80 4 Índex d’imatges Imatge 1: Casos d’us ........................................................................................................ 9 Imatge 2: Esquema d’aplicació ...................................................................................... 10 Imatge 3: Símbol scite.................................................................................................... 14 Imatge 4: Esquema pàgina web...................................................................................... 18 Imatge 5: Exemple etiquetes. Punt de vista editor.......................................................... 18 Imatge 6: Exemple mostrat al navegador ....................................................................... 18 Imatge 7: Jerarquia fitxer “map” .................................................................................... 19 Imatge 8: Esquema del funcionament de PHP [11]........................................................ 20 Imatge 9: Exemple codi PHP inserit en HTML ............................................................. 21 Imatge 10: Esquema procés PHP MapScript [13].......................................................... 23 Imatge 11: Càrrega d’un mapa amb PHP MapScript..................................................... 24 Imatge 12: Pàgina web oficial de PostgreSQL............................................................... 26 Imatge 13: Tipus de dades del estàndard SQL en PostgreSQL [20]............................... 27 Imatge 14: Tipus de dades estesos per PostgreSQL [20] ............................................... 27 Imatge 15: Creació d’una base de dades i sentències SQL ............................................ 28 Imatge 16: Finestra SQL ................................................................................................ 28 Imatge 17: Nova base de dades ...................................................................................... 29 Imatge 18: Configuració de la base de dades ................................................................. 30 Imatge 19: Taules espacials............................................................................................ 30 Imatge 20: Creació de una nova taula ............................................................................ 30 Imatge 21: Estructura de la nova taula ........................................................................... 31 Imatge 22: Camps de la capa auxiliar............................................................................. 31 Imatge 23: Sentència SQL per definir el camp geomètric.............................................. 31 Imatge 24: Sentència de la inserció del polígon............................................................. 31 Imatge 25: Polígon inserit .............................................................................................. 32 Imatge 26: Cartografia visualitzada amb gvSIG .......................................................... 32 Imatge 27: Selecció de la capa “pomes” ........................................................................ 34 Imatge 28: Per obrir el símbol del sistema ..................................................................... 34 Imatge 29: Canvi de directori de treball......................................................................... 34 Imatge 30: Funcions de PostgreSQL.............................................................................. 35 Imatge 31: Resultat de la consulta de la capa “carrers” ................................................. 36 Imatge 32: Càrrega de les capes ..................................................................................... 36 Imatge 33: Mostra de la correcta inserció de les capes .................................................. 36 Imatge 34: Creació d’un nou camp ................................................................................ 37 Imatge 35: Utilització de la calculadora per recalcular els valors.................................. 37 Imatge 36: Selecció dels polígons. Vista general........................................................... 38 Imatge 37: Selecció dels polígons. Vista propera........................................................... 38 Imatge 38: Estètica de la taula........................................................................................ 39 Imatge 39: Creació i comprovació de la base de dades nova......................................... 39 Imatge 40: Arxiu “dbfpru.sql”........................................................................................ 40 Imatge 41: Mostra dels registres de la taula ................................................................... 40 Imatge 42: Vinculació de les dos taules ......................................................................... 41 Imatge 43: Creació dels índex........................................................................................ 42 Imatge 44: Programació.................................................................................................. 43 Imatge 45: Resultat al fitxer de text................................................................................ 43 Imatge 46: Definició d’un símbol................................................................................... 44 Imatge 47: Crida a l’arxiu de símbol.............................................................................. 45 Imatge 48: Imatges i ubicació......................................................................................... 45 5 Imatge 49: Ubicació i contigut de font........................................................................... 46 Imatge 50: Estructura de l’arxiu “.css”........................................................................... 47 Imatge 51: Arxiu “map” ................................................................................................. 48 Imatge 52: Arxiu jeràrquic ............................................................................................. 48 Imatge 53: Objecte “projection”..................................................................................... 49 Imatge 54: Capa shape.................................................................................................... 50 Imatge 55: Càrrega capa lineal shape............................................................................. 51 Imatge 56: Capa PostGIS ............................................................................................... 52 Imatge 57: Càrrega de capa lineal PostGIS.................................................................... 52 Imatge 58: Càrrega de capes de diferents tipus, PostGIS............................................... 53 Imatge 59: Esquema capa WMS .................................................................................... 53 Imatge 60: Eixida GetCapabilities ................................................................................. 54 Imatge 61: Càrrega de la capa amb gvSIG..................................................................... 54 Imatge 62: Visualització de l’ortofoto amb gvSIG......................................................... 54 Imatge 63: Ortofoto visualitzada a la pàgina web.......................................................... 55 Imatge 64: Pàgina índex. Remarca de l’ACTION.......................................................... 55 Imatge 65: Sentències inicials ........................................................................................ 56 Imatge 66: Variables relacionades amb el map.............................................................. 56 Imatge 67: Funcions de pgAdmin .................................................................................. 57 Imatge 68: Modes........................................................................................................... 58 Imatge 69: Botó d’ajuda ................................................................................................. 59 Imatge 70: Pàgina d’ajuda principal............................................................................... 59 Imatge 71: Ajuda de la consulta..................................................................................... 59 Imatge 72: Missatge no autoritzat .................................................................................. 60 Imatge 73: Taules de la base de dades............................................................................ 60 Imatge 74: Relació de les taules ..................................................................................... 61 Imatge 75: Esquema del procés...................................................................................... 63 Imatge 76: Pàgina d’inici................................................................................................ 64 Imatge 77: Pàgina principal............................................................................................ 65 Imatge 78: Botó d’ajuda ................................................................................................. 65 Imatge 79: Pàgina d’ajuda.............................................................................................. 66 Imatge 80: Botons........................................................................................................... 66 Imatge 81: Aproximació a la cartografia........................................................................ 67 Imatge 82: Navegació..................................................................................................... 67 Imatge 83: Allunyament................................................................................................. 68 Imatge 84: Formulari de la consulta............................................................................... 68 Imatge 85: Formulari editat........................................................................................... 69 Imatge 86: Visualització en la base de dades ................................................................. 69 Imatge 87: Àrees d’influència o buffers ......................................................................... 70 Imatge 88: Llistat dels afectats....................................................................................... 70 Imatge 89: Inici d’usuari no autoritzat ........................................................................... 71 Imatge 90: Aspecte pàgina web...................................................................................... 71 Imatge 91: Botó d’ajuda ................................................................................................. 72 Imatge 92: Pàgina d’ajuda.............................................................................................. 72 Imatge 93: modes ........................................................................................................... 72 Imatge 94: Ampliació de la cartografia.......................................................................... 73 Imatge 95: Navegació..................................................................................................... 73 Imatge 96: Allunyament................................................................................................. 74 Imatge 97: Formulari...................................................................................................... 74 Imatge 98: Format ECW [4 (2002: pàg 399)] ................................................................ 75 6 Imatge 99: web de descàrrega [10]................................................................................. 79 Imatge 100: Pàgina web de PostgreSQL [14] ................................................................ 80 Imatge 101: Elecció de la llengua................................................................................... 81 Imatge 102: Opcions d’instal·lació................................................................................. 81 Imatge 103: Creació d’un usuari .................................................................................... 81 Imatge 104: Instal·lació PostGIS.................................................................................... 82 Imatge 105: Selecció d’opcions...................................................................................... 82 Imatge 106: Selecció del directori.................................................................................. 83 Imatge 107: Selecció del directori.................................................................................. 83 Imatge 108: Connexió base de dades ............................................................................. 83 Imatge 109: Finestra d’intal·lació................................................................................... 84 7 1. Introducció Gairebé sense adonar-nos, Internet s'ha implantada en les nostres vides i ens hem acostumat a utilitzar-ho en molts camps de la nostra vida quotidiana. Cada vegada queden menys llocs per ser conquistats per aquesta tecnologia, permetent moure'ns pel món en qüestió de segons. Si a això li anem sumant que cada vegada els equips informàtics són més potents i que tota persona pot tenir accés a un, ens trobem amb que el nombre d'usuaris de la xarxa augmenta cada vegada més Internet té moltes aplicacions, així doncs podem trobar a gent que utilitza cercadors, que realitza compres per Internet, consulta guies de viatge… Molts perfils diferents d'usuaris, però tots ells tenen alguna cosa en comú: Recerca d'informació en pàgines Web dinàmiques. Ara bé, Internet guanya molt interès quan determinades aplicacions d'organismes o empreses faciliten informació, permetent interactuar amb elles, pràcticament en temps real i estalviant-nos així temps de desplaçament als diferents llocs. És per això que, amb l'increment del nombre d'usuaris que, des de casa o oficina busquen informació, aquestes empreses o organismes decideixen posar a la xarxa informació d'interès general per a l'usuari que consulta aquesta pàgina. No obstant això i com a complement, també s'utilitza la Intranet, que a diferència d'Internet, el nombre d'usuaris que pot accedir a la informació és menor, requereix de contrasenyes i és més segura. També hi ha hagut un gran desenvolupament en les aplicacions de lliure distribució, això permet el lliure ús de les mateixa sense haver de realitzar una gran inversió, tenint molta més llibertat d'elecció de programari. En aquest projecte es desenvolupa una aplicació que ens permet conèixer els diferents tipus de perill que es donen en una determinada zona d'una cartografia i les persones que es veuen afectades, tot mitjançant programari, fonamentalment, lliure i utilitzant Internet com a mitjà de publicació, diferenciant dos tipus d'usuaris (autoritzats i no autoritzats) perquè puguin consultar i editar la informació o solament consultar la informació. 2. Objectius En aquest projecte final de carrera s'ha desenvolupat una aplicació que persegueix els següents objectius: Un servei municipal de neteja necessita una aplicació que permeta als empleats anotar i consultar els focus de contaminació existent en la ciutat de valència, aqueix programa ha d'oferir la possibilitat d'accedir a ell des de qualsevol tipus de dispositiu mòbil, ordinador portàtil, "smart phone", tablet pc, etc. L'aplicació ha de permetre: L’ objectiu d'aquest projecte és el de donar una solució, al problema de la localització de focus contaminants en la ciutat de València. Per a açò primer es farà un estudi sobre els tipus de focus contaminants, com es van a representar en el mapa, etc. Els punts contaminants deuen estar georreferenciats. També es requereix que els empleats del la empresa encarregada de la neteja de la ciutat de València, tinguen accés a aquesta informació tant per a consultar-la com para modificar-la. 8 L'aplicació té les següents característiques: • Inserció i edició de dades puntuals a través d'Internet. • Creació d'àrees d'influència per l'usuari quan inserte o consulte un punt. • Diferenciació de funcions de l'aplicació per usuaris autoritzats i no autoritzats. • Disseny d'una aplicació per a tots els usuaris (experts i no experts) puguin usar-la. Utilització de programes lliures per resoldre els problemes que es plantegin, sempre que resulti factible i fiable Finament i com és obvi, aquest projecte es realitza per finalitzar la titulació d'Enginyer tècnica en informàtica de sistemas. 3. Descripció del problema 3.1. Petició del client L'empresa de neteja municipal de l'ajuntament de València, ens planteja el següent problema: a causa del constant increment de població en la ciutat de València, han anat sorgint incessants focus de contaminació, alguns d'ells han de ser ràpidament esmenats. Però el problema al que s'enfronta la citada empresa de neteja, és la lentitud a l’hora de passar els avisos a la central de neteja, aquestos eren passats bé pels ciutadans, en aquesta cas en ocasions l'avís o era fals o no coincidia amb la descripció, per la qual cosa es perdia temps en aquests avisos poc exactes o bé eren els propis treballadors de la neteja que es trobaven amb els focus contaminants, però no s'informaven d'ells fins a la finalització de la jornada laboral, quan arribaven a la central. 3.2. Requeriments L'empresa ens demana que li donem una solució al problema de localització dels focus contaminants i al problema dels retards a l'hora d'informar a la central dels mateixos. També necessita tenir actualitzat en tot moment els focus contaminants i que aquests siguen accessibles pels operaris de neteja, sent aquests mateixos els que puguen consultar mitjançant algun sistema que permeta localitzar inequívocament el lloc exacte del focus, a més de poder donar-los de baixa quan siguen esmenats. A més l'empresa requereix que es puga portar un històric dels focus contaminants daus d'alta en la cuideu de València, per a poder fer informes, estadístiques i portar accions de millora en els serveis de neteja. L'últim requeriment de l'empresa és que el cost de l'aplicació que de solució a les seves peticions, sigui el més ajustada possible. 3.3. Proposta de solució D'acord als requeriments de l'empresa l'alumne pren les següents decisions: • Per respondre a la petició de tenir actualitzat i totalment accessible la informació dels focus contaminants es proposa, crear un servidor web, que al seu torn allotgi un servidor de mapes, amb la possibilitat d'inserir punts (que seran els focus contaminants), modificar-los, actualitzar-los, esborrar-los a més a més, donarà la possibilitat de tenir els focus georreferenciats, per a una major exactitud. 9 Opcionalment, per a donar més realisme, el servidor de mapes, podrà carregar una ortofoto, a través d'un servidor de l'Institut Cartogràfic Valencià (d'ara endavant ICV), però es podrà treballar perfectament sense aquesta. • Per poder donar resposta a la necessitat de tenir un històric de totes les incidències detectades i esmenades, l'aplicació es recolzarà en una base de dades, per poder emmagatzemar la informació requerida per l'empresa, respecte a focus contaminant. • Per a seguir les instruccions de baix cost, demanat per l’empresa, s'utilitzarà sempre aplicacions lliures, tals com: PostGis, PostGres, Mapserver, algunes d'aquestes estan recolzades per l'ICV • Com a possible actualització de l'aplicació l'alumne proposa afegir al focus contaminant un àrea d'influència o buffer, amb la qual podrem conèixer que persones han estat afectades pel focus, a través d'una altra base de dades. Imatge 1: Casos d’us 16 • CartoWeb • Ka-Map • Chameleon • Pmapper 6. Coneixements necessaris 6.1. HTML Aquestes sigles signifiquen HyperText Markup Language (Llenguatge de marques de hipertext) [7] i és el llenguatge per a la construcció de pàgines web. El llenguatge HTML s'utilitza per descriure l'estructura i el contingut en forma del text i de les imatges. HTML és un llenguatge que s'escriu entre etiquetes. Aquestes etiquetes van envoltades pels símbols “<>”. HTML també pot tindre inclòs algun script que pot modificar l'aparença o les funcions de la pàgina web. 6.1.1. Conceptes bàsics d’HTML El llenguatge HTML es pot crear i editar en qualsevol editor de texts bàsic, però existeixen programes que ens permeten dissenyar la pàgina web, editar codi, etc. Aquestos programes són els que normalment es solen utilitzar per a crear pàgines web. Aquestos editors es coneixen per editors WYSIWYG (What You See Is What You Get) perquè el resultat final que s'obté és el que s'ha estat veient a la vista preliminar del programa de disseny. Alguns editors són DreamWeaber, Microsoft FrontPage... No obstant existeixen uns altres tipus d'editors. Per visualitzar una pàgina web, només cal indicar la URL (Localitzador Uniforme de Recursos) al navegador que s’ha elegit. Normalment totes les adreces d'Internet solen començar per “www”, es pot dir que és el sistema d'informació propi d'Internet, i té algunes de les següents propietats [9]: Informació per hipertext: part de la informació o de les imatges que veiem estan vinculats, i per mostrar la informació podem fer clic a l'enllaç. Tipus d'informació: poden aparèixer a les pàgines web informació escrita, imatges, vídeos, sons... És global: perquè podem accedir a ell des de qualsevol plataforma i utilitzant qualsevol navegador i estant en qualsevol part del món. Pública: tota la informació pot estar distribuïda per tot arreu, a qualsevol lloc del món. Dinàmica: en el sentit que la informació pot ser actualitzada. 6.1.2. Organització de les pàgines web Una pàgina web ha d'estar ben organitzada. Normalment es pot fer un esborrany al principi, per exemple primerament es marquen els objectius, els continguts que tindrà la pàgina web, l'estructura que busquem, etc. 17 Una bona estructura és important perquè es facilita la lectura de la pàgina web, fonamentalment l'estructura depèn del contingut que tindrà la pàgina web [9]. 6.1.3. Llenguatge HTML Aquest llenguatge té la funció d’estructurar documents. La majoria dels documents tenen estructures comunes (títols, paràgrafs, llistes...) que seran definides per aquest llenguatge per mitjà d'etiquetes. Qualsevol cosa que no siga una etiqueta és part del document. Aquest llenguatge no descriu l'aparença del disseny d'un document sinó que ofereix a cada plataforma que li done format segons la seua capacitat i la del seu navegador (grandària de la pantalla, fonts que n’hi ha instal·lades...). Per això, no hem de dissenyar els documents basant-nos en com lluïxen en el nostre navegador sinó que hem de centrar-nos a proporcionar un contingut clar i ben estructurat que resulte fàcil de llegir i entendre [9]. HTML té dos avantatges que ho fan pràcticament imprescindibles a l'hora de dissenyar una presentació web: la seua compatibilitat i la seua facilitat d'aprenentatge a causa del reduït nombre d'etiquetes que utilitza [9]. Bàsicament, els documents escrits en HTML consten del text mateix del document i les etiquetes que poden portar atributs. Açò portat a la pràctica, vindria a ser: <Etiqueta> text afectat </etiqueta> L'etiqueta del principi activa l'ordre i l'última (que serà la del principi precedida del signe “/”) la desactiva. Generalment açò funciona d’aquesta manera, però no totes les etiquetes tenen principi i final, perquè no cal tancar l’etiqueta en tots els casos. Els fitxers de text es converteixen en pàgines web quan salvem el document amb extensió “*.html”. Aquests tipus de pàgines són pàgines estàtiques normalment, sempre que no continguen un altre tipus de codi. 6.1.4. Estructura d’un document HTML Bàsicament són tres les etiquetes que descriuen l’estructura general d’un document HTML. Són etiquetes de filtrat perquè no canvien l’aparença del document. Aquestes etiquetes són: <HTML>: Aquesta etiqueta limita el document HTML, indicant el començament i el final del document HTML. <HEAD>: Dins d’aquesta etiqueta es troba la capçalera de la pàgina web, el contingut introductori. També trobem l’etiqueta “TITLE” que s’utilitzarà per identificar el contingut de la pàgina web, només cap la possibilitat d’utilitzar una única etiqueta “TITLE”. En l’etiqueta “HEAD” cal no posar text que haja d’estar en el document. <BODY>: En aquesta etiqueta es col·locarà tot el text de tota la pàgina web. Dins de l’etiqueta “BODY” podem col·locar molts tipus d’etiquetes, com poden ser “<P>” per separar paràgrafs, “<IMG>” per inserir imatges, “<HR>” per dibuixar una línia horitzontal, “<H1>” per indicar un títol d’importància 1, “<H2>” per 18 indicar un títol d’importància 2… i com aquestes etiquetes moltes més que podem utilitzar [6]. A la imatge següent es pot observar l’esquema bàsic que té una pàgina web: Imatge 4: Esquema pàgina web En la imatge següent es mostra un exemple bàsic des d’el punt de vista de l’editor de textos, on escrivim el text que programem, i la vista des d’el punt de vista del navegador d’Internet. Imatge 5: Exemple etiquetes. Punt de vista editor L’anterior codi produeix el següent resultat: Imatge 6: Exemple mostrat al navegador 6.2. MapServer Com s'ha dit abans, MapServer és un servidor de cartografia que ens permet visualitzar i consultar cartografia per Internet. La configuració del fitxer, que tindrà extensió “*.map” es mostrarà a continuació, així com la seua estructura jeràrquica d'apartats. El fitxer “*.map” segueix una estructura jeràrquica en les diferents propietats. Cadascuna de les propietats o objectes han d'estar correctament ubicades a l'arbre 19 del fitxer, açò no significa que si no s’identa correctament el fitxer no funcione, però si ens ix algun tipus d'error (que sol ser habitual) serà molt complicat trobar-lo en una estructura poc ordenada. A més a més, una bona sangria ens permet visualitzar fàcilment la jerarquia del document. L'objecte principal és el tipus “MAP”, per tant totes les característiques es col·locaran dins de les etiquetes “MAP” i ”END”. Com a exemple es mostra un esquema del fitxer “MAP” on es mostra una correcta sangria segons el nivell de les dades que estem definint: Imatge 7: Jerarquia fitxer “map” 6.3. PHP PHP, que significa Hypertext Pre-processor, és un llenguatge de programació interpretat, un llenguatge que està dissenyat per a ser executat a través d'un intèrpret, i que dóna un aspecte dinàmic a les pàgines web [7]. PHP és un llenguatge multiplataforma orientat a web que té capacitat de connexió amb la majoria dels motors de base de dades, destacant MySQL y PostgreSQL. Un avantatge important és que és un llenguatge lliure i que permet les tècniques de programació orientat a objectes. Per programar en PHP no és necessari tindre una metodologia determinada, ni cal declarar el tipus de les variables abans d’utilitzar-les [7]. Les pàgines web que estan fetes purament amb HTML no permeten una interacció amb elles, és per açò que es necessita de codi PHP per donar un aspecte dinàmic a la pàgina web. A més a més, el manteniment de les pàgines és molt menys complicat perquè PHP pot tindre opcions d’una base de dades, i per tant només seria necessari actualitzar la base de dades. HTML per sí mateix no permet aquesta opció. És necessari que una pàgina web tinga més codi a part de HTML perquè permeta ser una pàgina web dinàmica connectant a una base de dades o un altre tipus d’informació. 6.3.1. Funcionament PHP Des d’el nostre ordinador es carrega una pàgina al navegador d’Internet i es visualitza una pàgina web que pot ser un formulari(per a introduir dades, per exemple quan emplenem una fitxa en registrar-nos en un fòrum). En veure la pàgina web es poden omplir els camps que demana al formulari i polsar el botó que enviarà la informació que s’ha escrit a la pàgina a un servidor d’Internet i en aquest moment és quan el codi PHP és interpretat i per exemple, es podria accedir a una base de dades. El resultat s’envia al navegador, normalment una pàgina HTML. 20 Imatge 8: Esquema del funcionament de PHP [11] Com PHP s’executa al servidor no és necessari que el navegador el suporte perquè és independent d’ell, però és fonamental per a un bon funcionament que el servidor suporte codi PHP. 6.3.2. Avantatges de fer servir PHP Abans s'ha comentat que PHP permet crear pàgines web dinàmiques, però també té altres utilitats com per exemple incloure encapçalaments, peu de pàgina per a estandaritzar pàgines HTML, controlar l'accés a les pàgines web, etc. Alguns avantatges d'utilitzar PHP són les següents: El codi que interpreta o genera pàgines web es pot incloure al mateix arxiu (en el qual s'estiga treballant, per exemple l'arxiu de la pàgina web principal d'aquest projecte) dins d'una etiqueta HTML. És més senzill de mantenir les pàgines web que són molt dinàmiques. És un llenguatge en què resulta fàcil d'integrar l'accés a base de dades (connectar-se a elles) en pàgines HTML, com per a presentar un formulari que es modifique. També hi ha funcions per a mostrar estadístiques del servidor. És un llenguatge paregut en sintaxis i gramàtica al llenguatge C, però menys complexe. Les funcions són paregudes a Perl. Es poden definir funcions pròpies. Es poden escriure expressions lògiques i matemàtiques. Ens permet combinar la potència de les dades organitzats lògicament i emmagatzemats de forma persistent amb la facilitat d'ús d'un navegador. PHP té funcions per obrir i tancar connexions a les bases de dades, per a enviar sentències SQL y rebre el resultat de la consulta. 6.3.3. Conceptes bàsics de PHP Al fitxer on s’està programant la pàgina web inclourem el codi PHP dins del codi HTML, al mateix fitxer. La manera en que inserirem en qualsevol part del codi HTML és de la manera que es mostra [11]: <?php 21 codi ?> Quan s’han inserit les etiquetes que indiquen el codi PHP ja podem començar a programar PHP. Per poder programar es necessita declarar les variables, variables que durant l’execució del programa poden variar de contingut. A pesar que les variables s’han de declarar, no cal definir-les abans d’usar-la de manera que la mateixa variable al principi de l’execució pot tindre el valor de “3” i al final de l’execució pot tindre el valor de “hola” [11]. Com en altres llenguatges de programació (C o Javascript) PHP també té els operadors aritmètics, comparatius i lògics. D’una manera ràpida es mostren a continuació [11]: Aritmètics: suma (+), resta (-), multiplicació (*), mòdul (%), suma un (++) i resta un (-). Comparatius: usats per a prendre valors i poder prendre decisions, estos són els d'igual (==), distint (!=), menor que (<), major que (>), menor o igual (<=), major o igual (>=). Lògics: són usats per a avaluar diverses comparacions, combinant els possibles valors d'estes, com “i” (&&, and), “o” (||, or), “no” (!). També es poden utilitzar instruccions com condicionals, bucles, cadenes, etc. que ens ajudaran a filtrar unes altres instruccions que s’executaran segons les condicions o les instruccions de filtrar que estan pel codi. A continuació es mostra com es col·loca el codi PHP i el resultat que es visualitza al navegador. L’exemple és molt bàsic però ens dóna una idea de com funciona PHP: Imatge 9: Exemple codi PHP inserit en HTML 6.3.3.1. Variables per valor i per referència Es pot treballar de dues maneres, respecte a les variables, en PHP. Una d’elles és tractar les variables per valor; açò significa que quan una variable és passada, per exemple a una funció ,per valor, el mètode rep una “còpia” del valor de la variable, i per tant, els canvis que li fem a aquesta variable dins d’aquesta funció no afecten a la variable original [21]. 22 No obstant, quan passem per referència una variable a un mètode i es fan variacions dins del context de la funció, en aquest cas sí que afecta a la variable original [21]. Emprarem un tipus o un altre segons quines siguen les necessitats de la nostra aplicació. En el nostre cas, s’han utilitzat els dos tipus segons les funcions i segons els valors que es volien obtindre, valorant en cada cas els nostres interessos. 6.4. PHP MapScript Bàsicament PHP MapScript és una extensió de MapServer que permet accedir a la seua funcionalitat des de PHP. En aquest projecte es vol fer una pàgina web dinàmica amb PHP i alhora s’ha de treballar amb cartografia, que és MapServer qui dóna aquesta funcionalitat; però s’ha de tenir en compte que entre PHP i MapServer ha d’existir un nexe comú pel qual els dos llenguatges puguen entendre’s. Bé, el nexe en comú s’anomena PHP MapScript [12]. Però… com treballa PHP MapScript? La manera en que treballa s’explica a continuació. En general, quan es vol accedir a una pàgina, s’envia una petició HTML, que produïx una recerca d'una URL a través de HTTP. La petició arriba al servidor, que executarà el programa necessari per obtindre la informació, en cas que siga necessari executar un programa, clar. S’elabora la resposta que serà enviada de nou a la pàgina web. Quan s’utilitza MapScript, el servidor executa un script, que conté informació i funcions, igual que qualsevol altra pàgina programada en un altre llenguatge. En funció del llenguatge que s’utilitza per programar s’utilitzaran unes funcions o altres, que serviran per a buscar les dades GIS. Aquest mòdul de MapScript permet fer diverses operacions amb dades espacials, des d'accedir a aquestes dades des de la web o reprojectar les dades entre altres [13]. Bàsicament aquest és el procés que segueix PHP MapScript; a la imatge següent es mostra de manera esquemàtica el procés: 23 Imatge 10: Esquema procés PHP MapScript [13] Per incloure codi MapScript a la pàgina web es crea l’arxiu “map” com fins ara s'ha vist; la diferència està que quan creem la plantilla HTML tindrà inclòs codi PHP MapScript. Abans de l'etiqueta HTML i entre les etiquetes de PHP carregarem la versió de PHP MapScript que tenim nosaltres, per a aquest exemple concretament s'ha utilitzat “php_MapScript.so”. Aquesta línia no cal posar-la si l'arxiu “php.ini” (dins del pac d'instal·lació) està configurat per a carregar-lo. A la línia 5 es crea una variable que contindrà la ruta on es troba el nostre arxiu, el que volem publicar. A la línia 7 es crea una variable, generalment nomenada “map” que contindrà un objecte, que serà el nostre arxiu “map”. En aquest cas només és necessari donar-li el nom de l'arxiu, perquè li estem indicant que agafe aquest arxiu de la ruta continguda en “map_path”. Perquè es dibuixe el nostre mapa, es crea una variable (línia 8) en la qual s’indica que ens dibuixe la variable “map”, que alhora conté l'arxiu i la ruta. Finalment s’ha de salvar eixa imatge perquè puga ser dibuixada (línia 9). La manera de dibuixar el mapa és per mitjà de la variable que conté la imatge guardada, dins del body de la plantilla HTML, i dins de l'etiqueta “IMG”. 24 Imatge 11: Càrrega d’un mapa amb PHP MapScript Hi ha moltes eines, objectes i funcions de MapScript com per exemple les de zoom, llegenda o objectes de la imatge entre altres. A continuació s'anomenaran alguns exemples que s'han utilitzat per desenvolupar aquesta aplicació [12]: De la classe layer, que fa referència a la capa, “queryByPoint (pointObj point, int mode, double buffer)” amb el qual es pot consultar un punt dins d'una cartografia que estiga georreferenciada (és refereix al posicionament amb el qual es defineix la localització d'un objecte espacial). Entre parèntesi li donem els paràmetres que li anem a passar. De la classe de layer tenim el mètode “Open ()” que s'encarrega d'obrir una capa determinada. De la classe de layer tenim el mètode “getNumResult ()” que pren el nombre de resultats d'una capa en l'última consulta realitzada sobre ella. De la classe legend, que fa referència a la llegenda que extraurem de les dades introduïdes en l'arxiu map, per exemple, podem anomenar el mètode “set (string property_name, new_value)” que ens permet crear la llegenda. De la classe map, que fa referència al mapa que estem creant, el mètode “getsymbolbyname (string symbol_name)”, pren un objecte amb el símbol a què ens hem referit. 6.5. Base de dades 6.5.1. Què són les bases de dades Una base de dades és, de manera rigorosa, un conjunt de dades emmagatzemades amb una estructura lògica. Per poder treballar amb les dades que emmagatzem a les bases de dades, han de tindre un ordre i estar relacionats entre sí. Aquestes característiques són les que donen coherència per poder treballar amb les dades d'una manera sistemàtica [7]. A continuació s'exposen una sèrie de conceptes relacionats amb les bases de dades que hem de conèixer-los: Tupla: és una filera en una taula. Atribut: és una columna en una taula. 25 Domini: és el conjunt de valors dels quals els atributs obtenen els seus valors. Clau: és un atribut amb una característica de rellevància per a identificar la tupla. Clau primària: és una clau amb valors únics, és a dir, no ocorren més d'una vegada en l'atribut. Clau secundària: A diferència de la clau primària, no necessàriament identifica una fila d’una altra (poden existir repeticions), però serveix per a processar la informació en un ordre adequat, per a un procés en concret [22]. Cardinalitat: és el nombre de tuplas en una taula. Grau: és el nombre d'atributs en una taula. Relació: correspondència entre dos o més taules. 6.5.2. Programes per treballar amb bases de dades De la lectura prèvia es pot deduir que els programes per treballar amb Bases de Dades (DBM) faciliten les funcions de: • Emmagatzemar físicament. • Garantir consistència. • Garantir integritat. • Atomicitat transaccional. • Manejar vistes a la informació. Quan creem una base de dades s’ha de tindre en compte algunes consideracions que ens permeten fer un disseny de base de dades eficients. Algunes d'aquestes consideracions són: • La velocitat d'accés. • La grandària de la informació que contindrà la nostra base de dades. No és el mateix que ocupe 6 caràcters que 25. • El tipus d'informació que inclourà cada taula de la base de dades, entre ells pot ser numèric, text, date, etcètera. • La facilitat d'accés a la informació. • La facilitat per a extraure la informació requerida. • El comportament del manejador de bases de dades amb cada tipus d'informació. 32 Imatge 25: Polígon inserit 7.1.3. Àrees d’influència Les àrees d’influència (d'ara endavant també es diran buffers) han de crear-se en una capa de tipus multipolygon[1]. A l’arxiu map (arxiu que sosté la informació cartogràfica) no podem carregar una capa que no existeix o bé que està buida (que no té registres). Per poder visualitzar la capa de buffers (estiguen o no creats) hem de dibuixar un minúscul polígon a la base de dades i així poder visualitzar la capa sempre; encara que parega buida, existeix un polígon auxiliar. 7.1.4. Inclusió de les capes “shp” a la base de dades El format ESRI Shapefile (SHP) és un format d'arxiu informàtic propietari de dades espacials desenvolupat per la companyia ESRI, qui crea i comercialitza programari per a Sistemes d'Informació Geogràfica com Arc/Info o ArcGIS. A la nostra base de dades cal incloure dades cartogràfiques que originalment es troben en format shape (capes d’illes cartogràfiques i carrers): Imatge 26: Cartografia visualitzada amb gvSIG El procés de transformació és relativament senzill de fer per consola en Linux si el dividim en els següents apartats: • Creem per consola una base de dades espacial (que consisteix en una base de dades que emmagatzema les coordenades dels punts inserits) buida amb la instrucció corresponent. Cal tindre en compte que per fer una base de dades espacial hem d’executar les llibreries que ens 33 permeten fer aquest tipus de base de dades, en el nostre cas estan ubicades a /home/usr/share/PostGIS. o Createdb –U postgres pr: amb aquesta ordre vam crear la base de dades, pr es el nom de la base de dades, que ha de tenir intenament. o Createlang –U postgres plpgsql pr: amb aquesta ordre definim el llenguatge de programació per a una base de dades PostgreSQL. o Psql –U postgres –f lwPostGIS.sql –d pr: carreguem PostGIS a la base de dades. Amb aquesta ordre afegim suport d'objectes geogràfics a la base de dades. o Psql –U portares –f spatial_ref_sys.sql –d pru: car carregar aquest arxiu per poder treballar amb els sistemes de referència. • Comprovem que la base de dades ha sigut creada satisfactòriament. • Ara podem fer la transformació de shape a format postgres. Es passarà de format a postgres l’arxiu “poma”, nomenarem al camp geomètric “geom” que tindrà el sistema de referència amb què estem treballant, el 23030, i l’arxiu es crearà al directori /home/alumno/. Cal tindre en compte que aquesta funció no llig el prj, per això li donem el sistema de referència, si no li ho hauriem d'haver editat después. Per aquest procediment s’utilitza la següent sentència: o shp2pgsql manza.shp pomes -w -g geom -s 23030 > /home/alumno/pomes.sql • Ara s’insereix a la base de dades l’arxiu sql creat amb la sentència: o psql -U postgres -f /home/alumno/pomes.sql -d bbddnom. • Cal comprovar que tot ha anat bé fent un select de la nova capa creada. 34 Imatge 27: Selecció de la capa “pomes” • Si tot és correcte podem fer una còpia de la taula per poder importar-la a la nostra base de dades. Però si no tenim el sistema operatiu Linux també és senzill fer-lo amb Windows. Dividim el procés en els següents passos: Obrim una consola de Windows i ens ubiquem al directori on està instal·lat postgres. Imatge 28: Per obrir el símbol del sistema Imatge 29: Canvi de directori de treball 35 Al directori on està instal·lat postgres tenim una col·lecció de funcions que podem executar. En aquest cas hem d'executar la funció shp2pgsql, que com es pot comprovar està ubicada al directori. Imatge 30: Funcions de PostgreSQL Aleshores ens queda executar la sentència sql que ens permet passar d'un format a un altre. Cal saber que la capa que es vol passar a format sql ha d'estar ubicada al mateix directori on està la funció que anem a executar. La funció que hem d'executar és la mateixa sentència que la que hem utilitzat a Linux. • shp2pgsql c.shp carrers -w -g geom -s 23030 > C:\Archivos de programa\PostgreSQL\8.2\bin\carrers.sql Quan tenim l'arxiu sql ja podem inserir-lo a la base de dades. La sentència és la mateixa que hem fet servir a Linux. Ara s’insereix a la base de dades l’arxiu sql creat amb la sentència: • psql -U postgres -f C:\Archivos de programa\PostgreSQL\8.2\bin \carrers.sql -d val. Podem comprovar que s'ha inserit correctament si fem una selecció de la nova capa: 36 Imatge 31: Resultat de la consulta de la capa “carrers” També es pot visualitzar la capa, de manera que el resultat (pintat en línies de color verd) es veu que és complet. Imatge 32: Càrrega de les capes De manera que la possible base de dades finalment queda de la següent manera: Imatge 33: Mostra de la correcta inserció de les capes 37 7.1.5. Capa de dades. Vinculació de dues capes En aquest apartat s’explica com s’han vinculat les dues capes, tant la capa que ens creem nosaltres per poder completar la informació, com la capa d’illes cartogràfiques. 7.1.5.1. Preparació de la capa d’illes de cases Per poder vincular dues capes hem de tenir un camp en comú. Una de les capes és la que conté les dades de les illes de cases i originalment no té cap camp que tinga informació de cada polígon de forma única. Per tant, primerament cal crear un camp de tipus numèric que identifique de manera única cada polígon. La ferramenta que s’ha utilitzat per resoldre aquest problema és ArcGIS perquè té una senzilla funció que en uns segons enumera cada registre de manera única. Ara solament cal crear-nos un camp nou: Imatge 34: Creació d’un nou camp Com el camp el definim numèric, s’ompli del valor “0”, però amb la calculadora d’ArcGIS es pot tornar a calcular els seus valors. Imatge 35: Utilització de la calculadora per recalcular els valors 38 7.1.5.2. Capa de dades complementària Per poder fer una consulta òptima per a l'exemple, s’han elegit quatre polígons de la capa d’illes de cases, que des d’una vista general estan ubicats al centre de la ciutat de València: Imatge 36: Selecció dels polígons. Vista general Imatge 37: Selecció dels polígons. Vista propera Per poder afegir més informació a la nostra base de dades anem a crear una taula amb una sèrie de dades que vincularem a la capa d’illes de cases. S’utilitza un full de càlcul que tindrà els camps: • Número d’illa de cases: o el que és el mateix, el número únic que identifica cada polígon. • DNI: És un número triat a l’atzar, identificació única per a cada suposat habitant. • Nom: També triat a l’atzar, identifica a cada suposat habitant. • Carrer: Nom real, tret de fer consultes als carrers que envolten els polígons amb gvSIG. • Núm: És el número de portal al carrer que estem consultant. 39 • Pis: Equivalent a l’altura en la qual habiten les persones. • Porta: Dins de l’altura, el número que identifica cada unitat de vivenda. Imatge 38: Estètica de la taula Per poder integrar aquesta taula a la base de dades cal salvar-la com a tipus “dbf”, i serà quan podrem treballar amb ella. Al sistema operatiu Linux ens creem una nova base de dades no espacial i buida, que li nomenarem “dbfpru”. Imatge 39: Creació i comprovació de la base de dades nova Una vegada que tenim la base de dades creada podem restaurar-la, per a poder utilitzar-la en windows. Per poder restaurar-la s’utilitza la funció “shp2pgsql” i solament haurem d’importar les dades. Utilitzem les següents instruccions: • Per obtindre el fitxer “sql” que després importarem utilitzem la sentència: shp2pgsql paradbf4.dbf dbf -w > /home/alumno/dbf4pru.sql • Aquesta altra ens inclourà a la base de dades que havíem creat la taula “sql” que ens hem creat abans: psql -U postgres -f /home/alumno/dbf4pru.sql -d dbfpru 40 És molt important saber que aquest procés no suporta accents ni caràcters estranys, i per tant, cal filtrar. A continuació es mostra una imatge en què es veu l’estructura de l’arxiu “sql”. Imatge 40: Arxiu “dbfpru.sql” Efectivament, quan executem la segona sentència comentada abans estem executant el fitxer “sql”, replet d’instruccions que s’afegeixen a la base de dades que ens havíem creat. Per tant, tan sols queda veure gràficament que realment tots els registres s’han inserit adequadament; si fem una mostra de tots els registres de la taula, mitjançant un select, tenim el següent resultat. Imatge 41: Mostra dels registres de la taula Efectivament, les dades s’han inserit bé, de manera que ja contem amb la informació dels polígons i la informació que s’afegirà. 7.1.5.3. Vinculació de les dues capes 41 Per poder vincular les dues capes que ens hem creat cal utilitzar la integritat referencial, que ens permet actualitzar els registres d’un camp d’una taula “A” a partir de la inclusió o esborrat dels elements d’una taula “B”. D’aquesta manera, la capa d’illes de cases té la informació de tots els polígons que conformen la ciutat de València. Cal vincular la informació de la capa que ens hem creat (la capa que hem tret a partir de la “dbf”) del ciutadans, amb aquesta capa d’illes de cases per tal que si en una capa (modificable per l’administrador de la pàgina) s’elimina algun registre, que la taula s’actualitze automàticament, sense la mà de l’administrador. En el següent esquema es mostra la vinculació dels dos camps de les dos taules a partir d’una sentència “sql” (integritat referencial). Els dos camps que es vinculen defineixen de manera única cada registre. Imatge 42: Vinculació de les dos taules Amb aquesta sentència “sql” queden vinculades les dos taules per dos dels camps que la formen. Per poder executar la sentència correctament, cal que els dos camps tinguen la restricció de clau primària (primary key); aquesta restricció exigeix que el valor d’una columna o la combinació de varies columnes no espiguen duplicats en el conjunt de files de la taula, i els valors del camp no siguen nuls [1]. La restricció de clau primària equival a les restriccions d’unicitat (unique) i valor no nul (not null). 7.1.6. Consulta Amb la finalitat de donar una aplicació més al projecte, s’ha fet un estudi per poder aportar una solució d'una consulta complexa. En aquest cas proposem buscar 48 7.2.6. Arxiu map L’arxiu map és aquell que conté tota la informació cartogràfica que va a ser visualitzada al servidor de cartografia. En els següents apartats s’explica de manera més especificada cada apartat o cada bloc d’aquest arxiu. Imatge 51: Arxiu “map” 7.2.6.1. Estructura de l’arxiu map L’arxiu map és configurat de manera jeràrquica en cadascuna de les diferents propietats, per aquest motiu és necessari identar correctament cada línia al lloc que li correspon. L’arxiu map s’edita i es treballa amb l’editor de textos “scite”, tot el contingut anirà dins de les etiquetes “MAP” i “END”: Imatge 52: Arxiu jeràrquic A l’arxiu map es defineixen primerament els paràmetres generals del map, com poden ser: • NAME: Es refereix al nom del map, pel qual identificarem l’objecte, quan vulguem fer referència a ell des d’algun altre fitxer (en el nostre cas, des de l’arxiu “val.php”). • IMAGETYPE: El resultat que ens torna el servidor és una imatge, però hem d’especificar el format d’eixida. • UNITS: Cal indicar les unitats en què s’estableixen les coordenades del mapa. Les unitats són necessàries per poder obtindre l’escala. • SHAPEPATH: Aquesta ruta és on emmagatzemem les capes, en cas que carreguem alguna capa shape. En general és més òptim treballar amb rutes relatives. 49 • IMAGECOLOR: Es refereix al color de fons que s’indica en valors RGB, tres valors entre 0 i 255 que indiquen els valors del roig, verd i blau, respectivament. • STATUS: Es refereix a si el mapa està actiu o no, es a dir, si serà visible o no. • SIZE: Aquest paràmetre es refereix al tamany en píxels de la cartografia. Aquest paràmetre estarà relacionat amb la velocitat amb què es generarà la imatge. Aleshores cal no excedir-se, ni per dalt ni per sota. • EXTENT: És la cartografia que va a ser representada al mapa, cal augmentar un poc les coordenades perquè no estiga pegada als límits del mapa. • PROJECTION: Aquest objecte és complet i per tant s’ha d’especificar dins de les etiquetes “PROJECTION” i “END” i defineix la projecció que tenen les nostres dades cartogràfiques. Cal utilitzar el codi “EPSG” o especificar un per un els paràmetres necessaris. En el nostre cas, utilitzarem el codi “EPSG”. Imatge 53: Objecte “projection” La segon part del fitxer map està constituïda per les capes, que poden tindre molts orígens: shp, wms, PostGIS, entre altres. S’explica en els següents apartats els que s’han utilitzat en aquest projecte. 7.2.6.2. Càrrega d’una capa “shp” Per poder carregar una capa en format shape cal definir les propietats de la capa dins de les etiquetes “LAYER” i “END”. Es definirà el nom, que correspon al nom que li volem donar com a etiqueta, a més a més, cal indicar els diferents paràmetres. La definició de la capa pot ser tan complicada o senzilla com vulguem nosaltres. Podem carregar sols la capa o donar-li un estil determinat amb tamany (definit per un nombre sencer), color (indicat amb el sistema RGB), simbologia especial... A més a més, li donem un sistema de referència que en aquest cas es ED50 per a la zona 30, estem parlant de coordenades UTM. Els paràmetres que s’utilitzen són els següents [2]: • LAYER: Cadascuna de les capes que es vulga carregar, ha d’estar dins d’aquest objecte, iniciat i acabat per les etiquetes “LAYER” i “END”. Cada capa té uns paràmetres mínims que la defineixen; per exemple, per carregar una capa en format “shp”: o NAME: Etiqueta identificativa de la capa. 50 o DATA: Nom del fitxer “shape” que conté la informació que volem mostrar. o TYPE: S’indica el tipus d’informació que es vol mostrar, pot ser:  POINT: Cartografia puntual.  POLYGON: Cartografia poligonal.  LINE: Cartografia lineal.  RÀSTER: Imatge.  ANNOTATION: Anotació.  QUERY: Consulta o STATUS: Correspon a l’estat de visualització de la capa (no del mapa). És útil per activar o desactivar capes. o GROUP: És un paràmetre que ens permet agrupar vàries capes, y per tant tractar-les com a bloc. o PROJECTION: És el paràmetre que ens indica la projecció en què estan emmagatzemades les dades cartogràfiques de la capa. o CLASS: Aquest paràmetre defineix l’estètica que tindrà la capa. En la següent imatge es mostra l'estructura del bloc corresponent a la càrrega de capa SHP: Imatge 54: Capa shape Podem visualitzar la capa en format shape damunt la capa wms (El format wms és un estàndard creat pel OGC (Open Geospatial Consortium) Aquest estàndard internacional defineix un "mapa" com una representació de la informació geogràfica en forma d'un arxiu d'imatge digital convenient per a l'exhibició en una pantalla d'ordinador.) perquè pugem veure els carres d'una manera més global, així com podem comprovar que realment coincideixen amb els carrers de l'ortofoto. 51 Imatge 55: Càrrega capa lineal shape 7.2.6.3. Càrrega d’una capa PostGIS Per carregar una capa PostGIS també s'utilitzen les etiquetes “LAYER” i “END”, on es defineixen les propietats de la capa en aquest apartat. A diferència de la càrrega de capes en format SHP, cal fer una connexió de tipus PostGIS; en aquesta connexió es defineixen els paràmetres com l'usuari, contrasenya, localització del servidor i el número del port on es connecta. A més de tota aquesta informació, referent al tipus de connexió, cal indicar el nom de la capa a la qual fem referència, a més de tots els paràmetres com l'estat en el qual es visualitzarà la capa, el tipus de data que conté (punt, polígon...) i podem definir una simbologia entre altres propietats. En aquest cas s'ha estat utilitzant una simbologia relativament senzilla, que ens permet visualitzar les dades adequadament. També s'ha utilitzat la propietat que dóna transparència a una capa, ja que per l'ordre de visualització és més llegible. Per carregar una capa que siga PostGIS tenim els següents paràmetres, que sempre aniran inclosos dins de l’objecte “LAYER”: • CONNECTION TYPE: Aquest paràmetre identifica el tipus de connexió que estem realitzant. • CONNECTION: Aquesta línia s'usa per connectar-se a la base de dades, per tant, s’ha d’indicar l’usuari, la contrasenya, el nom de la base de dades, el servidor i el port. Els paràmetres han de ser exactament igual que la base de dades original. • NAME: És el nom o etiqueta que li donarem a la capa. • DATA: En aquest cas, aquest paràmetre indica el nom de la columna geomètrica de la taula que està inclosa a la base de dades, és a dir, la columna que conté la informació cartogràfica. • TYPE: Indica quin tipus de contingut hi ha a la columna geomètrica (punts, línies, polígons…) • STATUS: Indica la visibilitat de la capa. 52 • PROJECTION: Indica la projecció de la capa. • TEMPLATE: En cas que la capa estiga vinculada amb una plantilla, aquest paràmetre és el que ho indica. • CLASS: En aquesta variable es defineix el disseny de la capa que s’està publicant. Per tant, si agrupen l’estructura en bloc, integrat ja a l’arxiu map ens queda de la següent manera: Imatge 56: Capa PostGIS A la següent imatge tenim l'exemple de la càrrega d'una capa PostGIS, que com es pot comprovar no existeix variació en la visualització entre una capa PostGIS i una capa shape, si realment té les mateixes dades. En aquest cas, també s'ha dibuixat la capa dels carrers damunt de la capa wms, i evidentment, també coincideix. Imatge 57: Càrrega de capa lineal PostGIS A la següent imatge es carreguen les capes PostGIS de punts, línies i polígons: 53 Imatge 58: Càrrega de capes de diferents tipus, PostGIS 7.2.6.4. Càrrega d’una capa wms El servei Web Map Service (*WMS) definit pel OGC (Open Geospatial Consortium) produeix mapes de dades referenciades espacialment, de forma dinàmica a partir d'informació geogràfica. Des de MapServer també es pot carregar remotament capes. Per exemple, en aquest cas, s’ha utilitzat una capa servida mitjançant l’estàndard WMS. Aquesta manera de carregar una capa és molt semblant a la manera que s’ha explicat a l’apartat anterior, ja que comparteixen molts paràmetres, de manera que s’explicarà el procediment però no tots els paràmetres desglossats [16]: • Les dades van entre les etiquetes “LAYER” i “END” (color morat a la imatge 88). Ve definit pel nom i el tipus d’arxiu, en aquest car és “RÀSTER” perquè estem consultant una imatge. La connexió correspon a la URL del servidor que ens ha de donar la informació. El tipus de connexió respon al tipus d’estàndard, en aquest cas WMS. Finalment definirem les metadades. Imatge 59: Esquema capa WMS • Cal especificar el nom exacte de la capa que anem a consultar. Aquest nom el podem saber fent una petició “GetCapabilities” al servidor, on tindrem accés a la informació que s’ofereix. No obstant, podem fer 54 servir el programari lliure “gvSIG” per poder fer la connexió WMS, on també podem conèixer els noms de les capes que s’ofereixen. Imatge 60: Eixida GetCapabilities Imatge 61: Càrrega de la capa amb gvSIG Finalment, la capa que estem carregant té el següent aspecte utilitzant gvSIG: Imatge 62: Visualització de l’ortofoto amb gvSIG A la nostra pàgina tindrà l’aspecte següent: 55 Imatge 63: Ortofoto visualitzada a la pàgina web 7.2.7. Arxius “PHP” Per poder dinamitzar la pàgina web és necessari inserir el codi PHP dins del codi HTML, ja que HTML per sí mateix no dóna una activitat a la pàgina, sinó que és un element estàtic. 7.2.7.1. Arxiu índex Aquest arxiu és el primer que es visualitza (d'ací el seu nom) i el que dóna accés a les diferents funcionalitats de les pàgines principals. És un codi senzill perquè ha de filtrar als usuaris i per tant no mostra cap tipus de dada cartogràfica, la seua funció és arreplegar tant l'usuari com la contrasenya i emmagatzemar-los. És en aquest fitxer on comencem a relacionar-los. Per exemple, d'ací ja utilitzem l'arxiu plantilla “css”, també estem enviant la informació al fitxer “val.php” gràcies al “ACTION” del formulari. Imatge 64: Pàgina índex. Remarca de l’ACTION 56 7.2.7.2. Arxiu principal És aquest arxiu el que suporta la càrrega més important i el qual conté la major càrrega de programació en llenguatge “php” amb la funcionalitat “MapScript”. És necessari esmentar que per poder “enviar” la informació d'un fitxer a un altre cal iniciar amb les paraules clau “session_start()” (subratllat roig) i carregant la llibreria “.dll” que necessitem (en aquest cas php_MapScript_48) per donar la funcionalitat de “MapScript” al fitxer (subratllat rosa). Tot seguit l'arxiu es connecta a la base de dades amb la sentència (subratllat verd): Imatge 65: Sentències inicials En aquest moment, ja connectats a la base de dades podem recuperar les variables d'usuari i contrasenya que hem introduït al principi i serà en aquest moment quan s'avaluarà si l'usuari és autoritzat o no és autoritzat; l'avaluació es farà mitjançant una consulta a la base de dades i comprovant que existeix aquest registre. També al començament del fitxer cal indicar quina és la plantilla map que s’utilitza, igualment cal indicar el camí on està ubicat l'arxiu. Açò és necessari perquè en aquesta part ja s'està carregant la cartografia. Imatge 66: Variables relacionades amb el map Per poder dibuixar el mapa cal crear-nos un objecte “map” que utilitzarà la ruta on està ubicat l'arxiu map i el nom de l'arxiu map que ha de carregar. Aquest ens permetrà carregar totes les capes que tenim a l'arxiu map, amb la propietat “getLayerByName”. Quan es carregen les capes podem començar a col·locar els diferents elements que estaran ordenats espacialment a la pàgina, com poden ser la llegenda, l'escala i el mapa de referència; també les icones que accedeixen a la funcionalitat dels diferents usuaris. Els zoom funcionen d'una manera que tots coneixem. L'icona apropa els elements cartogràfics i l'icona allunya els elements. Perquè no es descontrole la mesura d'allunyament i la d'apropament s'ha posat com a zoom màxim el valor de l'extensió total del mapa. Quan l'usuari interactua amb la funció d'informació és quan entren en joc les diferents aplicacions dels diferents usuaris: autoritzats i no autoritzats. S'envien els valors de les variables que diferencien un usuari i un altre, a més a més, també s’envien les coordenades del punt que es consultarà o bé que s’inserirà a la següent pàgina de “php”, que és la de consulta. 57 7.2.7.3. Arxiu consulta Les funcions que té aquest botó (consulta), és traure per pantalla un formulari que ens mostre tots els camps dels quals disposa la base de dades per poder omplir, d'aquesta manera tan senzilla podem anar emplenant la mateixa, consultar o edita-lar; així com crear un arxiu de text que ens informe de les persones afectades i que han de ser evacuades. En aquest arxiu també hem de connectar a la base de dades, de manera que després de la connexió podrem procedir a realitzar les consultes a la base de dades. Com estem programant en un entorn de “PHP”, cal buscar unes funcions en les quals pugem introduir llenguatge “SQL” des de “PHP” i així poder donar una dinamicitat a la pàgina. Aquestes funcions “traductores” entre un llenguatge i un altre les podem trobar a l’ajuda de pgAdmin III, que les té arreplegades (la gran majoria) i ordenades: Imatge 67: Funcions de pgAdmin En el nostre cas s’han utilitzat les següents: • Pg_connect: connecta a la base de dades en què volem treballar • Pg_exec: Executa accions sql, com per exemple seleccionar, actualitzar i inserir dades a la base de dades. • Pg_numrows: És una funció que ens dóna el nombre de registres que té una base de dades. • Pg_result: assigna a una variable les dades a partir d’un identificador, resultat d’una funció pg_exec; és a dir, pg_exec genera un resultat numèric (identificador), es passa com a paràmetre a la funció pg_result i aquesta torna un valor, que li l’assignem a una variable. En aquest fitxer s’han dividit les funcions a les quals cada usuari podia accedir, depenent de com accedisca, unes accions són accessibles per tots els usuaris, tals com a consulta, però unes altres solament amb accessibles per usuaris registrats, com donar d'alta nous punts o modificar-los, fent servir una variable 64 8. Exemple pràctic En aquest apartat comentarem i mostrarem, pas a pas, les utilitats que s’han dissenyat i les funcions de l’aplicació. Aquest apartat es realitza quan ja hem acabat tota la programació, per tant poden haver variacions de les imatges que s’han estat utilitzant com a exemple als apartats anteriors. No obstant, l’aplicació definitiva té l’aspecte que es mostra en aquest punt. 8.1. Usuari autoritzat L’usuari inicia l’aplicació i es troba que ha de posar un nom d’usuari i una contrasenya. En escriure’ls ha de polsar el botó “Entrar”: Imatge 76: Pàgina d’inici En entrar, i com és usuari autoritzat es troba el següent aspecte: 65 Imatge 77: Pàgina principal Si no és un usuari que habitualment consulta la pàgina, disposa d’un botó d’ajuda que dóna la informació pertinent per poder procedir a l’ús de la taula. Imatge 78: Botó d’ajuda Quan s’ha polsat el botó tenim la següent informació: 66 Imatge 79: Pàgina d’ajuda Com la finestra d’ajuda s’obri en una nova pàgina, podem tancar-la i tornar a la pàgina on estaven. En un tamany més gran ix la cartografia en format imatge, en aquesta imatge apareixen dades cartogràfiques superficials (illes de cases), lineals (eixos de carrers) i puntuals (focus perillosos); a la dreta una llegenda dels punts (perquè puguen ser interpretats), i baix una imatge que representa el mapa de referència. Si ens fixem, a la part superior, per damunt de la imatge principal, n’hi ha quatre botons: Imatge 80: Botons Si l’usuari polsa, de dreta a esquerra, el primer botó augmentarà el zoom de la imatge, de manera que es visualitzarà la cartografia més gran. 67 Imatge 81: Aproximació a la cartografia En polsar el segon botó es té l’opció de navegar per la cartografia, perquè centra les dades cartogràfiques on es polsa el ratolí. Imatge 82: Navegació Si es polsa el tercer botó, s’obté el resultat invers al primer, es a dir, la cartografia s’allunya. No es pot allunyar més de l’extensió del mapa total. 68 Imatge 83: Allunyament En provar les icones dels zoom, es pot fer la consulta. Es polsa l’icona d’informació, i en comprovar que ha canviat a color roig, polsem sobre la imatge que representa la cartografia. Podem polsar sobre un punt existent, en aquest cas ens apareixerà una finestra que arreplega les dades d’aquest punt. Imatge 84: Formulari de la consulta Com l’usuari és autoritzat significa que pot editar alguna de les dades que mostra el formulari, per tant, podia canviar, per exemple, l’estat del focus. Aleshores, l’usuari realitzarà els canvis oportuns i polsarà el botó que salva els canvis. 69 Imatge 85: Formulari editat Per comprovar que tot ha anat bé i que realment s’han fet els canvis pertinents a la base de dades, cal actualitzar la pàgina principal i tornar a consultar el punt editat. En eixir el formulari es poden verificar els canvis (Imatge 115). També es poden consultar els canvis a la base de dades directament: Imatge 86: Visualització en la base de dades A més d’haver consultat el punt i editar-lo, si no n’hi havia àrea d’influència al punt, aleshores es crearà. 70 Imatge 87: Àrees d’influència o buffers Si minimitzem els navegadors i busquem l’arxiu de text que s’ha creat, es pot comprovar que tenim la informació dels habitants afectats dins de l’àrea d’influència: Imatge 88: Llistat dels afectats 8.2. Usuari no autoritzat L’usuari no autoritzat té menys privilegis que l’usuari autoritzat, de manera que serà comú una part del text de l’apartat anterior; no obstant, és interessant explicar-ho tot pas a pas perquè d’aquesta manera no cal llegir l’apartat anterior per poden entendre aquest apartat. L’usuari inicia l’aplicació i es troba que ha de posar un nom d’usuari i una contrasenya. En escriure’ls ha de polsar el botó “Entrar”: 71 Imatge 89: Inici d’usuari no autoritzat En entrar, i com és usuari no autoritzat es troba el següent aspecte: Imatge 90: Aspecte pàgina web Si no és un usuari que habitualment consulta la pàgina, disposa d’un botó d’ajuda que dóna la informació pertinent per poder procedir a l’ús de la taula. 72 Imatge 91: Botó d’ajuda Quan s’ha polsat el botó tenim la següent informació: Imatge 92: Pàgina d’ajuda Com la finestra d’ajuda s’obri en una nova pàgina, podem tancar-la i tornar a la pàgina on estaven. En un tamany més gran ix la cartografia en format imatge, en aquesta imatge apareixen dades cartogràfiques superficials (illes de cases), lineals (eixos de carrers) i puntuals (focus perillosos); a la dreta una llegenda dels punts (perquè puguen ser interpretats), i baix una imatge que representa el mapa de referència. Si ens fixem, a la part superior, per damunt de la imatge principal, n’hi ha quatre botons: Imatge 93: modes Si l’usuari polsa, de dreta a esquerra, el primer botó augmentarà el zoom de la imatge, de manera que es visualitzarà la cartografia més gran. 73 Imatge 94: Ampliació de la cartografia En polsar el segon botó es té l’opció de navegar per la cartografia, perquè centra les dades cartogràfiques on es polsa el ratolí. Imatge 95: Navegació Si es polsa el tercer botó s’obté el resultat invers al primer, es a dir, la cartografia s’allunya. No es pot allunyar més de l’extensió del mapa total. 80 o “Document Root”: Es comenta aquesta línia, es copia y es pega en la línia següent canviant la ruta on es troba el directori “www”. o “Directory”: Es comentar la línia i escrivim la ruta on es troba el directori “www”. o “Alias”: Es canvia l’àlies del fitxers temporals, indicant la ruta on es trova el nostre directori “temp” o “tmp”. • L’adreça web serà: http://localhost/. En aquest punt cal remarcar que per a el desenvolupament d'aquest projecte es necessita la llibreria “php_MapScrip_46.dll” per a poder accedir a les funcionalitats de PHP MapScrip. 13.2. PostgreSQL i pgAdmin III Aquest programa ens serveix per a gestionar les bases de dades. La seua descàrrega és pot fer des de la la pàgina web oficial, i la seua instal·lació es relativament senzilla. Imatge 100: Pàgina web de PostgreSQL [14] 13.2.1. Guia-esquema d’instalació En aquest programa és mes senzilla la instal·lació, de totes maneres és bona costum documentar al màxim el procés d'instal·lació perquè qui lo necessite pugui reproduir el procés. La instal·lació de PostgreSQL es executa executant l'arxiu PostgreSQL-8.0.msi del directori PostgreSQL. Triem la llengua en què volem que s'instal·li el programa. 81 Imatge 101: Elecció de la llengua Picarem Start i ens eixirà una advertencia que indica que si la versió d’Open SSL del nostre equip és antiga, el programa actualizarà la versió per una més recent. Imatge 102: Opcions d’instal·lació Ens conservaran totes les opcions d’ instal·lació excepte la ruta d’instalació, que l’elegirem. Per exemple “C:\PostgreeSQL\8.0”. Imatge 103: Creació d’un usuari En la configuració del servei, s'establirà un compte d'usuari que no existeixi i una contrasenya. Aquest usuari no pot tenir permisos d'administrador. En aquest cas escrivim "postgres" tant en usuari com en contrasenya, però es pot utilitzar un altre nom o un usuari ja existent. Si es tria un de nou, preguntarà si es vol crear un 82 de nou. Contestarem que si. També pot ser que ens informi que al contrasenya és poc segura i si volem que el programa creu una per nosaltres. Contestarem que no. Imatge 104: Instal·lació PostGIS En aquest moment ja es té instal·lada una part, però per accedir a la funcionalitat espacial (funcionalitat que ens permet, georeferenciar punts en un mapa) cal instal·lar PostGIS, que també es documenta en aquest document. La instal·lació de PostGIS s’efectua executant l’archiu PostGIS-setup-1.0.1-1.exe del directori “PostgreeSQL”. Piquem I Agree. Imatge 105: Selecció d’opcions Deixem les dos opcions seleccionades i piquem Next. 83 Imatge 16: Selecció del directori Call asegurar-se d’elegir el directori on hem instal·lat PostgreSQL perquè per defecte ens apareix un altre. Imatge 207: Selecció del directori A la pantalla Database connection escrivim “postgres” con usuari i contraseñilla i es deixa “dcmms” com a nom de la base de dades. Aquesta base de dades és una base de dades espacial que utilitzarem com a plantilla per crear les bases de dades. Imatge 108: Connexió base de dades 84 Si tot va bé es veu la pantalla següent: Imatge 109: Finestra d’intal·lació