Olá galera,
Dando continuidade ao nosso último post, iremos dar carga no banco de dados e criar o mapfile que será chamado pelo Openlayers.
Primeiro baixe o arquivo de estados em formato SQL. Caso você queira usar seu próprio shapefile, pode transformá-lo usando um comando que eu citei no post Alguns comandos úteis para PostgreSQL.
Caso você ainda não tenha instalado o PostgreSQL com PostGIS, recomendo olhar o post Instalando e configurando o PostgreSQL, PostGIS e pgAdmin no Ubuntu 12.04 antes de prosseguir.
Para gerar o banco e dar carga, usei o pgAdmin mas sinta-se a vontade para utilizar inclusive o terminal. É importante utilizar o template do PostGIS ao gerar o banco.
Agora que o banco de dados está pronto, cria na pasta raiz do projeto o arquivo fonts.list e insira o código abaixo:
ubuntu /usr/share/fonts/truetype/ubuntu-font-family/Ubuntu-R.ttf
Esse arquivo indica o caminho e nome da font que vamos utilizar no label do mapfile.
Ainda na pasta raiz do projeto, crie o arquivo codegeo.map e insira o código abaixo:
# # Mapfile - CodeGeo # MAP NAME 'codegeo_wms' IMAGETYPE PNG EXTENT -73.9913940429688 -33.7520141601562 -32.3924560546875 5.27179002761841 UNITS meters SIZE 800 600 FONTSET '/var/www/codegeo/fonts.list' # # Definição da projeção do mapa # PROJECTION "init=epsg:4326" END # # Formato de imagem que utiliza a biblioteca GD # OUTPUTFORMAT NAME "aggpng" DRIVER "AGG/PNG" MIMETYPE "image/png" IMAGEMODE RGBA EXTENSION "png" END # # Definição WEB # WEB TEMPLATE void IMAGEPATH "/var/www/codegeo" IMAGEURL "http://localhost/codegeo" METADATA "wms_title" "WMS PNG CodeGeo" "wms_onlineresource" "http://localhost/cgi-bin/mapserv?map=/var/www/codegeo/codegeo.map" "wms_srs" "EPSG:4326 EPSG:900913" "wms_abstract" "Serviço WMS PNG CodeGeo." "ows_enable_request" "*" "wms_feature_info_mime_type" "text/html" END END # # Camada de Estados do Brasil # LAYER NAME 'estados' CONNECTIONTYPE postgis CONNECTION "user=postgres password=1234 dbname=codegeo host=localhost" DATA "the_geom FROM estados USING UNIQUE id USING SRID=4326" TYPE POLYGON STATUS default TRANSPARENCY 65 LABELITEM 'nome' LABELCACHE ON CLASS NAME 'bahia' EXPRESSION ([codigo] eq 29) LABEL COLOR 0 0 0 FONT ubuntu TYPE TRUETYPE POSITION CC PARTIALS FALSE SIZE 9 BUFFER 5 OUTLINECOLOR 255 255 255 END STYLE OUTLINECOLOR 0 0 0 COLOR 187 117 0 END END CLASS NAME 'padrao' LABEL COLOR 0 0 0 FONT ubuntu TYPE TRUETYPE POSITION CC PARTIALS FALSE SIZE 9 BUFFER 5 OUTLINECOLOR 255 255 255 END STYLE OUTLINECOLOR 0 0 0 COLOR 155 137 123 END END END END
De um forma geral, o mapfile criado vai exibir todos os Estados do Brasil com seus respectivos nomes e com a Bahia em destaque.
Farei um comentário das linhas que possuem uma relevância.
Linha 11 - Caso pretenda utilizar um outra fonte ou esteja usando um sistema operacional diferente, certifique-se de setar o caminho correto para a fonte do seu sistema.
Linha 58 - Certifique-se de fazer as alterações para as configurações da sua máquina.
Linha 63 - Esse é o campo da tabela utilizado para exibir qual o conteúdo estará no label do mapa.
Linha 68 - Nesse trecho, o campo da tabela codigo é igualado ao valor do código da Bahia no banco de dados.
Para finalizar, antes da linha que contém o código map.setCenter( no arquivo project.js, insira o trecho abaixo:
var estados = new OpenLayers.Layer.WMS("Estados", "http://localhost/cgi-bin/mapserv?map=/var/www/codegeo/codegeo.map", { layers: "estados", transparent: true }, { isBaseLayer: false, visibility: false, singleTile: false } ); map.addLayers([estados]);
No trecho acima, seto o caminho onde nosso mapfile está e qual layer vamos exibir.
O resultado final deve se parecer com a imagem abaixo:
A versão final do nosso aplicativo pode ser baixado clicando aqui.
Um abraço e até a próxima.
Bom dia Benicio,
ResponderExcluirTentei adicionar meu layer que esta na projeção EPSG:29101, mas não é exibida minha imagem. Você poderia me ajudar por favor?!!!
Fernanda.
Bom dia Fernanda,
ExcluirComo você está usando uma projeção diferente, além do projection no OpenLayers, vai ser necessário acrescentar o displayProjection: new OpenLayers.Projection("EPSG:29101").
No MapServer também será necessário fazer alteração da projeção 4326 para a sua.
Caso ainda apresente algum erro, será necessário "registrar" a sua projeção incluíndo a chamada de dois arquivos javascript com os seguintes links http://svn.osgeo.org/metacrs/proj4js/trunk/lib/proj4js-compressed.js e http://spatialreference.org/ref/epsg/29101/proj4js/
Um abraço
Olá Benicio, obrigada pela dica...
ResponderExcluirNo entanto, ainda não consegui. Testei inclusive o seu exemplo, criando o banco e adicionando o "estados".
Quando habilito o estados também acontece da imagem não ser exibida.
Tem alguma ideia do que pode ser?.
Obrigada,
Fernanda
Olá Fernanda,
ExcluirTerminei de fazer o download do arquivo de exemplo aqui. Tive que mudar no .map o nome do banco de dados e a senha para fazer funcionar. Você chegou a fazer alguma alteração nos códigos?
Abraço
Bom dia!!
ResponderExcluirAs alterações que fiz no exemplo foram:
No codegeo.map foram:
FONTSET 'C:/codegeo/fonts.list'
IMAGEPATH "C:/codegeo"
IMAGEURL "C:/codegeo"
"wms_onlineresource" "http://localhost:8088/cgi-bin/mapserv.exe?map=C:\codegeo\codegeo.map"
CONNECTION "user=postgres password='5n7Em1p' dbname=codegeo host=localhost"
E no project.js alterei:
var estados = new OpenLayers.Layer.WMS("Estados",
"http://localhost:8088/cgi-bin/mapserv.exe?map=C:/codegeo/codegeo.map",
{layers: "estados", transparent: true},
{isBaseLayer: false,visibility: false,singleTile: false}
);
map.addLayers([estados]);
Quando tento habilitar o "estados" ele não aparece a imagem de estados e sim uma imagem com fundo rosa.
Se puder passar seu contato, agradeço muito pela ajuda, pois não consegui avançar nos meus estudos.
Muito obrigada, abraços,
Fernanda
Bom dia Fernanda,
ExcluirVocê está acessando a aplicação com http://localhost:8080 também? É importante que a url da aplicação e do acesso MapServer seja as mesmas. De qualquer forma, seguem os meus contatos GTalk: larsurilch@gmail.com e Skype:larsurilch. A noite devo estar online.
Um abraço
Boa tarde. Sei que já faz algum tempo do último post, mas estou tentando reproduzir o exemplo e estou com o mesmo problema da Fernanda. Quando habilito a camada estados aparece uma imagem de fundo rosa. Alguma dica para solucionar? Obrigada. Daiana
ExcluirOlá. Já faz um tempo do último post sobre esse exemplo, mas estou agora tentando reproduzir e estou com o mesmo problema reportado pela Fernanda. Quando habilito a camada estados aparece uma imagem rosa e a camada não é carregada. Alguma dica de como resolver esse problema?
ExcluirObrigada!
Boa noite Daiana,
ExcluirVocê já analisou a requisição que traz o layer do mapserver? Utilizando o Chrome pede pra abrir em uma nova aba que ele vai exibir o erro. Fica mais fácil de debugar.
Abraço
Benicio,
ResponderExcluirEsqueci de comentar minha máquina é Windows 7 64bits...
Fernanda.
Sem problemas. Acredito que esse não seja o motivo do erro não.
ExcluirComo faz isso usando o OpenLayers 3.1 ?
ResponderExcluirOlá Douglas,
ExcluirVocê pode usar Tile ou Image. Segue em anexo exemplos do próprio site do OpenLayers
http://openlayers.org/en/v3.1.1/examples/wms-tiled.html
http://openlayers.org/en/v3.1.1/examples/wms-image.html
Um abraço