A API do Google Maps pode ser utilizada para apresentar informações do GeoServer através de WMS e/ou WFS.

Você pode usá-la como um cliente para mostrar apenas os dados vindos do GeoServer, mas é claro que a grande vantagem é utilizar os recursos da API, como as imagens e a base de dados de ruas disponíveis.

Abaixo um breve tutorial sobre como apresentar os dados no Google Maps através do WMS.

Iniciando com Google Maps e GeoServer WMS

Pré-requisito:

Google Maps: Você precisará ir até a seguinte página e cadastrar-se para obter a API Key e indicar o URL onde você irá disponibilizar o Mapa. Depois você colocará a informação que foi gerado pela página do Google Maps em um html/javascript. Coloque este arquivo no endereço onde você indicou, e você terá que visualizar um mapa. Caso naõ consiga consulte a documentação.

GeoServer: Caso você não o tenha instalado em sua máquina, faça o download, instale e coloque-o para rodar. Para este exemplo estaremos usando um layer padrão, que vem na instalação.

Modificações: Uma vez realizados os passos acima, faça o download do arquivo gs-wms.js e coloque-o no mesmo diretório do seu arquivo Google Maps (que foi criado anteriormente).

Depois que o GeoSever e o Google Maps estiverem configurados, e com o arquivo gs-wms.js juntamente com o arquivo html gerado pelo Google Maps, é necessário apenas colocar o código abaixo no body do seu html:

Código Google Maps

Troque o atributo titleCountry.myBaseURL pela URL do seu serviço de WMS onde o GeoServer está rodando.

Caso tenha realizado todos os passos corretamente, você deverá estar vendo a seguinte imagem:

Google Maps