mapas educaional

Prévia do material em texto

XIII JORNADA DE ENSINO, PESQUISA E EXTENSÃO – JEPEX 2013 – UFRPE: Recife, 09 a 13 de dezembro. 
 
Usando Google Maps para Educação Ambiental na Bacia do Capibaribe 
 
Eduardo Barbosa Coelho de Moura1, Gilberto A. de A. Cysneiros Filho2 
 
Introdução 
Este artigo descreve um subprojeto que faz parte de um projeto maior: “Gente, Floresta e Água: Explorando 
Potencialidades Educativas em Áreas Protegidas na Bacia do Capibaribe” que realiza ações de educação socioambiental 
na bacia do Capibaribe. 
O subprojeto surgiu da necessidade de divulgar as áreas de conservação ambiental inseridas na Bacia do rio 
Capibaribe com o objetivo de criar uma maior conscientização de sua importância e como elas são geograficamente 
distribuídas. Nossa proposta foi mostrar as informações sobre as áreas de conservação através de um mapa interativo 
digital. 
 Unidades de conservação são espaços com características naturais relevantes, que têm a função de assegurar a 
representatividade de amostras significativas e ecologicamente viáveis das diferentes populações, habitats e 
ecossistemas do território nacional e das águas jurisdicionais, preservando o patrimônio biológico existente. O estado de 
Pernambuco institui a partir da lei estadual 13.787/09, de 08 de junho de 2009, o Sistema Estadual de Unidades de 
Conservação da Natureza- SEUC de Pernambuco. (Wikipedia, 2013). 
A maioria da informação tem uma localização e se alguma coisa tem uma localização, ela pode ser mostrada num 
mapa. Há várias soluções de mapeamento na web, tais como: Yahoo!Maps e Bing Maps, mas o mais popular é o Google 
Maps (Svennerberg, 2010). 
Google Maps fornece uma API (Application Programming Interface) que permite desenvolvedores criar aplicações 
baseadas em mapas altamente customizada (DuVander, 2010). Uma API consiste de uma coleção de funções que torna 
mais fácil a criação da aplicação. A Google Maps API é escrita em JavaScript e deixa você embutir Google Maps nas 
suas próprias páginas web (Google Maps JavaScript API v3, 2013). Além disso, é através da API que você pode 
customizar e configurar o mapa. 
A criação de mapas com Google Maps não necessita do uso de uma linguagem específica. Ao contrário, um mapa é 
uma combinação de HTML, CSS e JavaScript trabalhando juntos. O mapa é composto de uma grade de imagens (tiles) 
que são carregados em background com chamadas Ajax e depois inseridas dentro de um <div> numa página HTML. À 
medida que você navega no mapa, a API manda informação sobre as novas coordenadas e nível de zoom do mapa nas 
chamadas Ajax que retorna imagens novas. 
A API permite adicionar marcadores (Marker) no mapa. Um marcador representa uma localização no mapa e é 
definido pela suas coordenadas (latitude e longitude). Ele pode ter associado um conteúdo que é exibido dentro de uma 
janela sobre o mapa (InfoWindow). Foi criado para cada unidade de conservação um marcador e a InfoWindow de cada 
marcador contém informações sobre a localização, descrição, histórico, contato, links (Facebook, Wikipedia, Site). A 
figura 1 mostra a InfoWindow para o Parque Dois Irmãos. 
Material e métodos 
A criação do Google Maps exigem o conhecimento em HTML, CSS e JavaScript. Dessa forma, o bolsista teve que 
estudar as linguagens: HTML, CSS e JavaScript. A plataforma de ensino interativa online CodeAcademy foi usada pelo 
bolsista para aprender os fundamentos de programação para web necessários para construção do mapa. O uso do 
CodeAcademy trouxe várias vantagens: (i) conteúdo dos cursos são bastantes acessíveis a novatos em tecnologia; (ii) os 
cursos são bem práticos (eles são compostos de lições que contém uma explicação seguido de instruções para o que se 
fazer e em caso de dúvidas pode-se usar as dicas fornecidas); (iii) a ferramenta combina a lição, um editor de código e 
uma janela de visualização (que mostra como o código será mostrado num navegador), tudo numa mesma tela; (iv) à 
medida que você digita o código a ferramenta atualiza a visão do código; (v) cada lição é salva e ferramenta verifica se 
ela foi executada corretamente; (vi) permite acompanhamento do progresso a distância. 
Além disso, o bolsita teve que de estudar a API do Google Maps e para isso foi feito uso do tutorial da w3schools. 
Resultados e Discussão 
A pesquisa está demonstrando que o uso de novas tecnologias pode ser uma ferramenta poderosa no ensino de 
educação ambiental. Além disso, a pesquisa possibilitou ao bolsista adquirir um maior conhecimento das unidades de 
 
1 Primeiro Autor é Aluno da Escola de Aplicação do Recife(FCAP-UPE). Av. Sport Club do Recife, 252, Madalena, Recife-PE, CEP 50750-500 
E-mail: eduardo.barbosa.coelho@gmail.com 
2 Segundo Autor é Professor Adjunto do Departamento de Estatística e Informática, Universidade Federal Rural de Pernambuco. Rua Dom 
Manoel de Medeiros, s/n. Campus Dois Irmãos, CEP 52171-900. E-mail:g.cysneiros@gmail.com 
 
XIII JORNADA DE ENSINO, PESQUISA E EXTENSÃO – JEPEX 2013 – UFRPE: Recife, 09 a 13 de dezembro. 
 
conservação. O mapa pode ser visualizado através do seguinte endereço: 
http://programacapivara.org/uc/ 
A figura 1 mostra o Google Maps da unidades de conservação e em destaque as informaçõs do marcador da unidade 
de conservação do Parque Dois Irmãos. A figura 2, mostra informações mais especifícas da unidade de conservação. 
Para cada unidade de conservação existe uma página com informações detalhes da área. 
Agradecimentos 
Ao CNPq pelo financimento através de bolsa de Iniciação Científica. 
Referências 
CodeAcademy. http://www.codecademy.com/ Página visitada em: 22/09/2013. 
W3schools. http://www.w3schools.com Página visitada em: 22/09/2013. 
Google Maps API. https://developers.google.com/maps Página visitada em: 22/09/2013. 
Unidades de Conservação de Pernambuco. https://sites.google.com/site/peambiente/unidades-de-conservacao-de-
pernambuco Página visitada em: 22/09/2013. 
Wikipedia. Unidades de Conservação de Pernambuco. 
http://pt.wikipedia.org/wiki/Unidades_de_Conserva%C3%A7%C3%A3o_de_Pernambuco Página visitada em: 
22/09/2013 
Svennerberg, G. Beginning Google Maps API 3. 2nd edition, Apress, 2010. 328p. 
DuVander, A. Map Scripting 101: An Example-Driven Guide to Building Interactive Maps with Bing, Yahoo! And 
Google Maps. No Starch Press. 2010. 376p. 
Google Maps JavaScript API v3. https://developers.google.com/maps/documentation/javascript/ 
 
 
 
Figura 1. Mapa das Unidades de Conservação Ambiental 
 
 
 
 
 
 
 
 
 
 
XIII JORNADA DE ENSINO, PESQUISA E EXTENSÃO – JEPEX 2013 – UFRPE: Recife, 09 a 13 de dezembro. 
 
 
Figure 2 - Página sobre o Parque Dois Irmãos