DEV Community

Cover image for Do you know GeoJSON ?
Mohamed Ashiq Sultan
Mohamed Ashiq Sultan

Posted on

Do you know GeoJSON ?

#javascript #database #mongodb #todayilearned

Introduction

For those who don't know, GeoJSON is the standard data format used to store location data and geographical features.

Contents

  1. Terminologies
  2. Different Geometry types
  3. Resources

GeoJSON is just a JSON object. What makes them a different datatype from plain JSON is its specifications.

Some databases like Mongo DB has official support for GeoJSON data type. Just like how MongoDB identifies String and Integer types, it identifies and differentiates GeoJSON from normal JSON. It comes with support for indexing and querying GeoJSONs

In this post, I will cover some of basic concepts of the GeoJSON data type.

A typical GeoJSON looks like this.
Don't get overwhelmed, we have discussed everything below.

{
    "type": "Feature",
    "properties": {},
    "geometry": {
        "type": "Point",
        "coordinates": [-40.078125,70.72897946208789]
    }
}
Enter fullscreen mode Exit fullscreen mode

Terminologies

Coordinates

A single point in the map is called a coordinate
When we are pointing at a location on the map, we are pointing to some longitude and latitude units. We store these sets of units in an array called coordinates.
A coordinates array contains two elements longitude and latitude
NOTE: the order is important
coordinates : [ longitude , latitude ]

Geometry

Think of geometry as structures. A Geometry defines in what structure the coordinates are stored.
There are certain predefined case-sensitive types of geometry, namely 'Point', 'Line', 'Polygon', and more. We will see them one by one.

A typical geometry looks like below

"geometry": {
    "type": "Point",
    "coordinates": [longitude,latitude]
}
Enter fullscreen mode Exit fullscreen mode

"type"

Every geometry must have a property called "type" whose value must only be one of the GeoJSON types mentioned in the GeoJSON RFC

There are some geometry types that are used to store other geometry types. They are "Feature" and "FeatureCollection" we have discussed about them below.

Geometry Types

Point

A point is a single point or marker on the map. Its geometry contains a single coordinate. This may be used to store individual place like a store.

Alt Text

"geometry": {
        "type": "Point",
        "coordinates": [
            78.4918212890625,
            22.304343762932216
        ]
    }
Enter fullscreen mode Exit fullscreen mode

MultiPoint

As you have guessed by the name, a MultiPoint geometry is used to store multiple points of coordinates in a single geometry. Each element in the coordinates array is itself a coordinate. This may be used to store list of favorite places.

Alt Text

{
    "type": "MultiPoint",
    "coordinates": [
        [80.26951432228088,13.09223800602329],
        [80.27061939239502,13.091631907724683],
        [80.2714991569519,13.09260375427521],
        [80.27050137519836,13.093241199930675]
    ]
}
Enter fullscreen mode Exit fullscreen mode

LineString

They are a line of points. The JSON structure is the same as that of MultiPoint but since this is of type LinePoint, individual coordinates are treated as a connected line rather than points lying around distinctly.

Alt Text

"geometry": {
    "type": "LineString",
    "coordinates": [
        [80.2122116088867,13.113586344333864],
        [80.25959014892577,13.072121016365408],
        [80.29048919677733,13.114923819297273],
        [80.3207015991211,13.075799674224164],
        [80.33477783203125,13.112248862097216]
    ]
}
Enter fullscreen mode Exit fullscreen mode

MultiLineString

As the name states it is used to store more than one LineString in a single geometry. Each element of the Coordinates array is like a single LineString Coordinates array.

"geometry":{"type": "MultiLineString",
"coordinates" : [
[
[longitude,latitude],
[longitude,latitude],
[longitude,latitude]  
 ],
[
[longitude,latitude],
[longitude,latitude],
[longitude,latitude]  
 ],
[
[longitude,latitude],
[longitude,latitude],
[longitude,latitude]  
 ],
]}
Enter fullscreen mode Exit fullscreen mode

Polygon

The RFC specification defines polygons are linear rings, in case you are wondering what's a linear ring, so was I.
Let me put it this way, polygons are any shape which is closed, yes literally any shape. In the coven image of this post each letter is a polygon.

If you understood LineStrings, the RFC specification also defines polygons are closed LineString i.e a polygon is any shape that is closed. A closed LineString means the first and the last coordinate will be the same.

This may be used to store borders. May it be country's border, city, village or an area's border.

Alt Text

"geometry": {
    "type": "Polygon",
    "coordinates": [
        [
            [78.44238281249999,22.62415215809042],
            [77.8436279296875,22.151795575397756],
            [78.486328125,21.764601405743978],
            [79.0521240234375,22.233175265402785],
            [78.44238281249999,22.62415215809042]
        ]
    ]
}
Enter fullscreen mode Exit fullscreen mode

MultiPolygon

By this time you should have guessed, same like MultiPoint and MultiLine, MultiPolygon is a collection of Polygons. You can use this to store border information of different cities in a state.

The cover image of this post can be an example of MultiPolygon

Feature and FeatureCollection

Here comes the juice. Now you learned about how to store geographical data in various structures like Points, Lines, and Polygons. Now how do you store information for those locations?

The proper way to store geographical information is by using Feature and FeatureCollection.

GeoJSON Feature and FeatureCollections are geometry themselves. They are a kind of geometry that is used to store other geometry and properties (information) about that geometry.

A typical Feature looks like this

{
    "type": "Feature",
    "geometry": {
        "type": "Point",
        "coordinates": [-10.0,-10.0]
    },
    "properties": {
        "temperature": "4C",
        "country": "IN",
        "somepropertyName": "Some description"
    }
}
Enter fullscreen mode Exit fullscreen mode

In the above GeoJSON, the geometry can be any of the types we discussed earlier like Point, Line, or Polygon and the properties contain data and information about that geometry.

FeatureCollection

As the name suggests a FeatureCollection GeoJSON contains a collection of Features.

Alt Text

{
  "type": "FeatureCollection",
  "features": [
    {
      "type": "Feature",
      "properties": {},
      "geometry": {
        "type": "Point",
        "coordinates": [78.31054687499999,22.39071391683855]
      }
    },
    {
      "type": "Feature",
      "properties": {},
      "geometry": {
        "type": "Point",
        "coordinates": [78.486328125,11.43695521614319]
      }
    },
    {
      "type": "Feature",
      "properties": {},
      "geometry": {
        "type": "Point",
        "coordinates": [77.9150390625,27.176469131898898]
      }
    },
    {
      "type": "Feature",
      "properties": {},
      "geometry": {
        "type": "Point",
        "coordinates": [75.673828125,19.766703551716976]
      }
    }
  ]
}
Enter fullscreen mode Exit fullscreen mode

Resources

Top comments (4)

Collapse
 
_hs_ profile image
HS • • Edited

I think GeometryCollection is a bit shadowed by FeatureCollection. Didn't have time so far to test it out but would like to see pros & cons of it in regards to FeatureCollection.

Couple of things to note:

  1. Although PostGIS is wildly used and everything, MongoDB does a great job and at some tests it does better at performance for seeking intersections. I tested it up to I think 10k records non-indexed. Worked like a charm. However I did intentionally avoid index as I read somewhere that it's faster for some reason when not indexing and for me it's fast so I didn't bother testing indexed versions.
  2. MapBox and other tools like to make some additional requests. First ID is required and is required to be either number (int,long) or something convertible to it like "123121". So keep that in mind while storing data. Backend should probably not suffer from limits of frontend but it happened to me and I adjusted my code to use IDs of type number. Second there's something called right-hand rule for JSON and it impacts how coordinates are ordered in the arrays of Geometry. You can read about it a bit here and maybe have a Python lib I don't even use Python but it came out while searching for first page.
  3. Decimal places in coordinates are not useful after 8th place. Or maybe are but to really freakish stuff. Anyways this explains a bit more and answer below it explains it with a table. For short, you should be fine with 5 decimal places for a city/town/village and such, 6 decimal places for a building, 7 decimal places for bigger objects in a room, and 8 decimal places for placing small sensor in a room.

Hope I inspired you to extend the article about these things and research more so I don't have to. No point in having 2 articles about it and I'm a bit lazy so hope you upgrade this one or make a series :D

Collapse
 
consultentltd profile image
ConsulTent •

Would be pretty sweet if you could show an example of using GeoJSON with the maps you used above.

Collapse
 
dgloriaweb profile image
dgloriaweb •

When and how would you utilize this?

Collapse
 
veslav3 profile image
Roy Honders •

Yes!

Read next

shafayeat profile image

Advanced JavaScript Game Development Techniques for Modern Game Devs

Shafayet Hossain -

thinkthroo profile image

Biome.js, a toolchain to format and lint your web project

thinkThroo -

prince_beec5ccde00b7c6c73 profile image

Logo's designing effect in html css

Prince -

chintanonweb profile image

Achieve Clean Routing in Angular 17: Refactoring Tips & Techniques

chintanonweb -