OpenLayers: compreendendo melhor um “Layer Vetorial”

Publicado: 05/07/2013 em Programação, Serviços IP
Tags:, ,

1. Introdução
Um layer vetorial possui features. Mas onde estão estas features, como acessá-las? Podemos criar estas features no próprio script ou buscá-las remotamente em arquivos ou banco de dados. Neste post vamos explorar como buscar estas informações vetoriais remotamente.

A informação vetorial pode ser buscada em diversas fontes, podendo estar armazenada em diversos formatos. Para buscar estas informações vetoriais há necessidade de protocolos e servidores web de forma a transportá-las. OpenLayers oferece classes para ler/escrever features de/para muitas fontes, ou protocolos, e usando diferentes formatos: GML, KML, GPX, GeoJSON, GeoRSS e outras mais.

Para controlar o comportamento do layer vetorial, OpenLayers oferece 3 classes essenciais:

  • Protocol Class
  • Format Class
  • Strategy Class

São as utilizações destas classes que vamos explorar um pouco aqui neste post.

2. Protocol Class

A classe Protocolo se refere a comunicação, ou seja, controla como o layer vetorial se comunica com a fonte de dados. A especificação WFS define um protocolo com a finalidade de leitura e escrita de features. Existem 2 (duas) subclasses:

  • Protocol.HTTP
  • Protocol.WFS

OBS: só é possivel utilizar uma única subclasse da classe Protocol por vez.
2.1 Protocol.HTTP
A comunicação via protocolo HTTP estabelece uma requisição direta entre a classe do OpenLayers e o servidor de páginas onde está a fonte de dados, por exemplo com a utilização do Apache. Neste caso, será o próprio Apache que servirá o arquivo solicitado.

2.2 Protocol.WFS
O “Web Feature Service” (WFS) é um padrão OGC utilizado para solicitar features geográficos de um servidor. Na prática significa que um cliente faz uma requisição HTTP para um servidor que implementa o padrão WFS (o Geoserver por exemplo) e recebe um conjunto de features no formato GML. Do ponto de vista do OpenLayers, o WFS é nada mais que uma outra fonte de dados que pode ser lida para preencher um layer vetorial.

3. Format Class
A classe Format informa o formato dos dados em sua fonte e transforma os dados deste arquivo quando transferidos para os objetos da feature em uso no mapa. São diversos os formatos que podem ser utilizados no OpenLayers: KML, GeoJSON, GeoRSS e muito mais.

A classe Format possui diversas subclasses: Atom, WKT, WFS, Text, JSON, KML, WMSGetFeatureInfo, GeoJSON, XML e outras.
OBS: só é possivel utilizar uma única subclasse da classe Protocol por vez.

4. Strategy Class
A classe Strategy é utilizada com dois objetivos:

  • para construir a requisição;
  • e para determinar o que fazer com os dados da resposta, cujas regras serão aplicadas quando da transferência dos dados para a feature do layer.

A classe Strategy possui diversas subclasses: Strategy.BBOX, Strategy.Cluster, Strategy.Filter, Strategy.Fixed, Strategy.Paging, Strategy.Refresh e Strategy.Save.

Destacamos aqui as seguintes subclasses:

Strategy.BBOX Destinada a construção da requisição e utilizada quando se deseja: atualizações sucessivas dos dados toda vez que, por exemplo, se faz um pam ou zoom do mapa; solicitar apenas os dados que estão na área visível do mapa (quando usando um servidor WFS).
Strategy.FIXED Destinada a construção da requisição e utilizada quando se deseja que os dados sejam carregados do servidor remoto apenas uma única vez. Mesmo que se realize pam ou zoom no mapa, por exemplo.
Strategy.CLUSTER Destinada a especificar o que fazer com os dados retornados do servidor remoto, que serão agrupados em clusters baseados na distância ou em limiares de nível (“threshold”). A distância entre clusters é especificada por um inteiro em pixels (default é 20px).
Strategy.Save Uma estratégia para “commit” das features recém-criadas ou modificadas. Ao configurar a estratégia com a opção “auto”, as mudanças podem ser salvas automaticamente. Veja o post OpenLayers: utilizando o protocolo WFS para salvar features no servidor remoto Geoserver.

OBS: pode-se utilizar conjuntamente a classe destinada a construção da requisição com a classe destinada a especificar o que fazer com os dados, pois servem á propósitos distintos. Por exemplo, pode-se utilizar as classes BBOX e CLUSTER conjuntamente, isto é, construir a requisição da solicitação ao servidor WFS dos dados dentro da extensão do mapa visível, e o layer receberá os dados transformados em clusters.

Observações
a) Para carregar dados de alguma fonte de dados externa ao script, necessita-se no mínimo definir as classes Protocol e Strategy.
b) Os dados recebidos da fonte remota passam por regras/filtros (STRATEGY) e depois depositados na feature. Assim, os dados que vão para a feature não são exatamente aqueles que sairam do servidor remoto. Por exemplo, pode estar definida uma STRATEGY de CLUSTER no script que resultará na visualização do mapa bem menos pontos do que existiam originalmente.

5. Fazendo uma requisição de dados remotos
Tradicionalmente, as features são adicionadas ao layer vetorial em 4 (quatro etapas):

  • cria-se o layer vetorial;
  • cria-se a geometria do ponto;
  • cria-se a feature a partir da geometria do ponto;
  • adiciona-se a feature ao layer.

Vejamos um recorte de código destas etapas.

var layer_vetorial = new OpenLayers.Layer.Vector('Layer Dados Locais');
var geom_point1 = new OpenLayers.Geometry.Point(-47.86,-15.83);
var feature_point1 = new OpenLayers.Feature.Vector(geom_point1);
map.layers[1].addFeatures([feature_point1]);

Mas, e para solicitar dados de um servidor remoto? O recorte de código abaixo ilustra este processo:


var layer_vetorial = new OpenLayers.Layer.Vector('Layer Dados Remotos',{
                     protocol: new OpenLayers.Protocol.HTTP({
                               url:'arquivo_dados.json',
                               format: new OpenLayers.Format.GeoJSON({})
                     }),
                     strategies:[new OpenLayers.Strategy.Fixed()]
});

No recorte acima, vemos:

  • a criação de um layer vetorial “layer_vetorial”;
  • a construção de um processo de comunicação via protocolo HTTP diretamente com a fonte de dados (“protocol”);
  • os dados remotos estão no formato GeoJSON (“format”);
  • os dados serão solicitados apenas uma única vez (“Strategy.Fixed”).

6. Um exemplo completo com dados no formato GeoJSON

<!DOCTYPE html> 
<html lang='pt'> 
<head> 
    <meta charset='utf-8' /> 
    <!-- Indicação da localização da bilbioteca OpenLayers -->
    <script type='text/javascript' src='./js/OpenLayers-2.12/OpenLayers.js'></script>
    <script type='text/javascript'>
    var map;
    function init() {
        // Criar o Objeto mapa
        //
        map = new OpenLayers.Map('map_element');
        // Criar o Layer básico raster e adicioná-lo ao mapa
        // Este mapa trabalha com a projeção geográfica (EPSG:4326)
        // que será utilizada diretamente ao longo deste exemplo
        var wms_layer = new OpenLayers.Layer.WMS(
                'OpenLayers WMS',
                'http://vmap0.tiles.osgeo.org/wms/vmap0',
                {layers: 'basic'},
                {}
        );
        map.addLayer(wms_layer);
        //
        // Adicionar dois controles ao mapa para auxiliar na visualização da localização
        map.addControl(new OpenLayers.Control.LayerSwitcher());
        map.addControl(new OpenLayers.Control.MousePosition({}));
        //
        // Fixar o centro do mapa no Distrito Federal, onde está a capital do Brasil
        // utilizaremos um nível de zoom=11 que dará uma boa aproximação para os propósitos deste exemplo
        map.setCenter(new OpenLayers.LonLat(-47.85,-15.80),11);
        if(!map.getCenter()){
            map.zoomToMaxExtent();
        }
        //Criar o Layer vetorial que contém as classes Format, Protocol, e Strategy
        var layer_vetorial = new OpenLayers.Layer.Vector('Layer Dados Remotos',{
            protocol: new OpenLayers.Protocol.HTTP({
                           url: 'meus_dados.json',
                           format: new OpenLayers.Format.GeoJSON({})
            }),
            strategies: [new OpenLayers.Strategy.Fixed()]
        });
        map.addLayer(layer_vetorial);
        }
    </script>
</head>
<body onload='init();'>
    <div id='map_element' style='width: 600px; height: 400px;'></div>
</body>
</html>

O arquivo GeoJson tem o seguinte conteúdo:


{
    "type": "FeatureCollection",
    "features": [
        {"type":"Feature","properties":{}, "geometry":{"type":"Point", "coordinates":[-47.86,-15.83]}},
        {"type":"Feature","properties":{}, "geometry":{"type":"Point", "coordinates":[-47.886,-15.741]}},
        {"type":"Feature","properties":{}, "geometry":{"type":"Point", "coordinates":[-47.811,-15.748]}},
        {"type":"Feature","properties":{}, "geometry":{"type":"lineString", "coordinates":[[-47.86,-15.83],[-47.886,-15.74],[-47.811,-15.748],[-47.86,-15.83]]}},
        {"type":"Feature","properties":{}, "geometry":{"type":"Polygon", "coordinates":[[[-47.86,-15.63],[-47.886,-15.72],[-47.811,-15.728]]]}}
    ]
}

Referências:
1- OpenLayers: API Documentation
2- OpenLayers Library Documentation
3- The GeoJSON Format Specification
4- JSON Formatter and Validator
5- JSON Validator
Veja também:
6- Um pouco de OpenLayers e Geoserver
7- OpenLayers: utilizando o protocolo WFS para salvar features no servidor remoto Geoserver

Anúncios
comentários
  1. ola, achei muito bom mas, quando eu pego a url do geoserver e passo para meus_dados.json nada acontece, porque sera? valeu

Deixe um comentário, pois isto é muito motivante para continuarmos este trabalho

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s