Posted on: April 13, 2026 05:22 PM
Posted by: Renato
Categories: javascript mapas maps json geojson geospacial
Views: 38
Tutorial de GeoJSON para iniciantes
Este é o primeiro artigo de uma série sobre como trabalhar com mapas no desenvolvimento web. Aqui, quero detalhar um tipo de dado muito importante, sem o qual é muito difícil imaginar o funcionamento dos mapas em aplicações web modernas. Então, hoje vamos analisar o que é GeoJSON , do que ele é composto e para que serve.
GeoJSON é um formato de dados para representar objetos geográficos e seus atributos. É usado para armazenar e trocar geodados, como pontos, linhas e polígonos, bem como seus atributos associados, como nome, descrição, endereço etc. Para obter explicações mais técnicas e oficiais, visite a página do formato GeoJSON .
O GeoJSON usa o formato de texto JSON para representar dados, o que facilita a leitura tanto por humanos quanto por computadores. No formato GeoJSON, os objetos geométricos são definidos como Point , LineString , Polygon , MultiPoint , MultiLineString e MultiPolygon .
Em GeoJSON, também é possível definir o sistema de coordenadas e outros parâmetros de objetos geométricos, como tipo de geometria, precisão das coordenadas e outras propriedades, mas abordaremos isso no próximo artigo.
O GeoJSON tornou-se um formato de dados amplamente utilizado na área da geoinformática e no desenvolvimento de software.
Existem diversas bibliotecas JavaScript que utilizam GeoJSON para trabalhar com dados geográficos. Algumas bibliotecas populares são:
- Mapbox GL JS — biblioteca JavaScript do lado do cliente para criar mapas e aplicativos web com a moderna tecnologia de mapeamento da Mapbox .
- Leaflet — biblioteca JavaScript de código aberto para mapas interativos compatíveis com dispositivos móveis.
- Turf.js — Biblioteca JavaScript para realizar operações espaciais e análises em dados GeoJSON.
- D3.js — Biblioteca JavaScript para produzir visualizações de dados dinâmicas e interativas em navegadores web.
- OpenLayers é uma biblioteca JavaScript de código aberto para exibir dados de mapas em navegadores da web como mapas interativos.
- e muitos outros…
Ponto 🔴
Um Ponto em GeoJSON é como uma localização em um mapa do tesouro. É um ponto específico no mapa que pode ser identificado usando um conjunto de coordenadas (latitude e longitude). Assim como você usaria um "X marca o local" para indicar onde um tesouro está enterrado, um Ponto em GeoJSON usa coordenadas para mostrar onde algo está localizado na superfície da Terra.
Por exemplo, se você estivesse criando um mapa do seu bairro e quisesse mostrar onde fica sua casa, você poderia usar um Ponto em GeoJSON para marcar a localização exata da sua casa no mapa.
Em resumo, um ponto é simplesmente uma forma de representar uma única localização em um mapa.
Representação GeoJSON de pontos:
{
"coordenadas" : [
8.308903076149363 ,
47.05038385401457
] ,
"tipo" : "Ponto"
}
LinhaString 📈
Uma LineString em GeoJSON é como um caminho em um mapa do tesouro. É uma linha que conecta uma série de pontos e pode ser usada para mostrar uma rota ou um caminho entre dois ou mais lugares.
Por exemplo, imagine que você está criando um mapa do tesouro que leva a um tesouro escondido. Ou você só quer encontrar o caminho para a padaria mais próxima 🥨
Você pode usar um LineString para desenhar um caminho no mapa que mostre a rota do ponto de partida até a localização do tesouro. O LineString seria composto por uma série de pontos que se conectam para formar uma linha, como em um desenho de ligar os pontos.
Em GeoJSON, uma LineString é uma forma de representar uma série de pontos conectados como um único objeto, facilitando a visualização de um caminho ou rota em um mapa. É comumente usada em aplicações como navegação e planejamento de transporte.
Representação LineString GeoJSON:
{
"coordenadas" : [
[
8.310242689008646 ,
47.05429444841852
] ,
[
8.310504651721004 ,
47.05399445514598
] ,
[
8.309440079847974 ,
47.05356534791096
] ,
[
8.309228280208345 ,
47.05341345071696
] ,
[
8.309100085689579 ,
47.05285522481279
] ,
[
8.308498128818854 ,
47.05292737678937
]
] ,
"tipo" : "LineString"
}
Polígono 🔲
Um polígono em GeoJSON é como uma forma em um mapa do tesouro. É uma forma fechada composta por linhas retas e pode ser usada para mostrar o contorno de uma área, como um parque, um lago ou um edifício.
Por exemplo, imagine que você está criando um mapa do tesouro que leva a um castelo. Você poderia usar um polígono para desenhar o formato das muralhas do castelo no mapa. O polígono seria composto por uma série de pontos que se conectam para formar uma figura fechada, assim como desenhar o contorno de um castelo em um pedaço de papel.
Representação GeoJSON poligonal:
{
"coordenadas" : [
[
[
12.478129652015241 ,
41.9022826549635
] ,
[
12.478129652015241 ,
41.90136017129154
] ,
[
12.479303348926749 ,
41.90136017129154
] ,
[
12.479303348926749 ,
41.9022826549635
] ,
[
12.478129652015241 ,
41.9022826549635
]
]
] ,
"tipo" : "Polígono"
}
Na verdade, o GeoJSON de polígono é muito semelhante ao LineString , mas a forma é fechada e, geralmente, em um polígono, as coordenadas inicial e final são o mesmo ponto. Veja o exemplo acima.
Multiponto ⚪️
Um MultiPoint é como uma coleção de pontos em um mapa do tesouro. É um grupo de pontos individuais, cada um com suas próprias coordenadas de latitude e longitude, e pode ser usado para mostrar a localização de vários elementos em um mapa.
Por exemplo, imagine que você está criando um mapa do tesouro que mostra a localização de pedras preciosas escondidas em um parque. Você poderia usar um MultiPoint para marcar a localização de cada pedra preciosa no mapa. O MultiPoint seria composto por uma série de pontos individuais, cada um com suas próprias coordenadas, assim como colocar vários pontos em um pedaço de papel para mostrar a localização de diferentes pedras preciosas.
Representação MultiPont GeoJSON:
{
"type" : "MultiPoint" ,
"coordinates" : [
[
-73.984 ,
40.748
] ,
[
-73.985 ,
40.749
] ,
[
-73.986 ,
40.75
] ,
[
-73.987 ,
40.751
]
]
}
MultiLineString 📈📉
Uma MultiLineString em GeoJSON é como um grupo de caminhos em um mapa do tesouro. É uma coleção de linhas que conectam uma série de pontos e pode ser usada para mostrar várias rotas ou caminhos entre diferentes lugares em um mapa.
Por exemplo, imagine que você está criando um mapa do tesouro que leva a um baú de tesouro e deseja mostrar três rotas diferentes que alguém poderia seguir para chegar lá. Você poderia usar um MultiLineString para desenhar três caminhos diferentes no mapa, cada um composto por uma série de pontos conectados.
Representação GeoJSON MultiLineString:
{
"tipo" : "MultiLineString" ,
"coordenadas" : [
[
[
2.3415215150407676 ,
48.848216086115485
] ,
[
2.3407788857352045 ,
48.847325398150645
] ,
[
2.3380359484630446 ,
48.8480269147754
]
] ,
[
[
2.330406031247776 ,
48.84706528274708
] ,
[
2.3372693633740766 ,
48.84692340104834
] ,
[
2.3372933191584764 ,
48.84791656449744
]
] ,
[
[
2.332755904765321 ,
48.85020559607162
] ,
... ,
[
2.336719866067824 ,
48.84788609233465
]
]
]
}
Multipolígono 🏔🌋🏝
Um MultiPolygon em GeoJSON é como um grupo de formas em um mapa do tesouro. É uma coleção de polígonos, cada um composto por uma série de pontos conectados, e pode ser usado para mostrar múltiplas áreas ou regiões em um mapa.
Por exemplo, imagine que você está criando um mapa do tesouro que mostra diferentes tipos de terreno em um parque, como uma floresta, um prado e um lago. Você poderia usar um MultiPolígono para desenhar três formas diferentes no mapa, cada uma composta por uma série de pontos conectados .
{
"type" : "FeatureCollection" ,
"features" : [
{
"type" : "Feature" ,
"properties" : { } ,
"geometry" : {
"type" : "MultiPolygon" ,
"coordinates" : [
[
[
[
2.291863239086439 ,
48.8577137262115
] ,
[
2.293452085617105 ,
48.856693553273885
] ,
[
2.2968403487010107 ,
48.85892279314069
] ,
[
2.2951175030651143 ,
48.86006886087142
] ,
[
2.291863239086439 ,
48.8577137262115
]
]
] ,
[
[
[
2.288226120523035 ,
48.86156752523257
] ,
[
2.2899681088877344 ,
48.86042149181674
] ,
[
2.290810388976098 ,
48.86063558796482
] ,
[
2.2909826735397587 ,
48.8611015587675
] ,
[
2.28947039792655 ,
48.862234983151495
] ,
[
2.288226120523035 ,
48.86156752523257
]
]
] ,
[
[
[
2.2912927602678224 ,
48.85709062155263
] ,
[
2.2905402133688426 ,
48.85661663833349
] ,
[
2.291917551492446 ,
48.855746990243716
] ,
[
2.2926328654095016 ,
48.85624492205244
] ,
[
2.2912927602678224 ,
48.85709062155263
]
]
]
]
}
}
]
}
Pronto! Analisamos todos os tipos básicos de elementos em GeoJSON. Espero que agora esse formato de dados esteja muito mais claro e fácil de usar para você.
Por fim, gostaria de compartilhar com vocês uma ferramenta muito útil para explorar e visualizar dados GeoJSON diretamente no navegador: https://geojson.io.
Se de repente você não entender algum tipo de dado, aconselho que tente no geojson.io e você vai descobrir!
Fique atento!
Fonte: https://medium.com/@dmitry.sobolevsky/geojson-tutorial-for-beginners-ce810d3ff169
Donate to Site
Renato
Developer