CODEWITHSUNDEEP
javascriptreactjsleaflet
Yuchao QIAN
Yuchao QIAN

Reputation: 1

Leaflet takes long time to create linestrings and clusters when using geojson of over 10 thousand points

I have met a problem with leaflet when creating a path of a scooter cluster the points used.
I have over 10 thousands points of geolocation in the data base and I want to create a path of a scooter. Due to the large amounts of points, I have to cluster the points for better presentation.
I use Geojson and put all the points into the coordinates. 

{
  "type": "Feature",
  "geometry": {
    "type": "LineString",
    "coordinates": [[10 thousand points]...]
  },
  "properties": {
    "name": "Dinagat Islands"
  }
}

And I use leaflet cluster library to create cluters. I tried chunkedLoading parameter but it seems no help. It still takes a great long time to cluster the points. In addition, it takes almost 10 seconds to create a path with 10 thousand points and the clusters of points.
Now I would like to create 10 or more paths and also the clusters for differents scooters, is there any solution to shrink the time of creation time?

Upvotes: 0

Views: 215

Answers (1)

Adam Paxton
Adam Paxton

Reputation: 1432

A 10 thousand point line is either a very long or a very detailed scooter ride. You probably need to reduce or simplify the geometry prior to trying to load it in the map.

If you are retrieving the linestring from a database like PostGIS, you can use ST_Simplify or ST_SimplifyPreserveTopology.

If your database doesn't have a simplification function, you might look into reducing the geometry after the data is fetched from the db, but before it is sent to the client to render on page with something like this or similar tool.

Same would go for static geojson files, try reducing the geometry prior to adding them to the project. Check out Mapshaper for this as well.

Upvotes: 2

Related Questions