Hfrhyu

When using Leaflet to visualize a large dataset (GeoJSON with 10,000 point features), not surprisingly the browser crashes or hangs. A sub-sample of 1000 features from the same dataset works flawlessly. Unfortunately I can't share the dataset for others to try out.

Does anybody have better solutions for visualizing such large datasets? (ultimate aim is to scale this to 2 million features) I'm even willing to consider offline visualization frameworks in case browser based alternatives such as Polymaps or d3.js etc. are deemed incapable.

Edit: Forgot to mention, the user needs to be able to filter the dataset by attributes. So out of N features, only the matching n <= N features might need to be dynamically rendered.

I'm Leaflet author. There's an awesome clustering plugin for this, Leaflet.markercluster. It's very fast and efficient (take a look at 50k markers example), looks and works very smoothly with nice animations, and has lots of options to suit to your needs.

You can use TileMill and render points as raster images, with fast interactivity from UTFGrid. It scales to millions of points and polygons, like this census map, since it intelligently sends only the data needed for specific areas, exactly when it's needed.

As far as I know, there are no other fast methods for doing this other than having a very fast WFS server, which is rather hard to maintain/scale to many viewers.

Disclosure: work for MapBox, wrote quite a bit of the code. But TileMill is free/open source, etc.

Have you looked into the leaflet clusterer? A blog post by the author describes it
here

Another option worth a look may be to use leaflet in combination with GIS Cloud. Take a look at this demo to see it handle a lot of geometries very quickly. Very impressive. I am in no way affiliated with GISCloud.

You should never display millions of points on a map. Not only because of the major performance problems, but also from a user's perspective because for them it most certainly will be difficult to interpret this data. Use some means of aggregating the data (clustering, aggregating to polygon areas etc.) combined with different display types at different zoom levels (e.g. show the "raw" point data only on very high zoom levels and use aggregated data everywhere else). An example would be a real estate site such as zillow.com.

I suggest you reduce the rendered amount of point features: The human eye won't be able to see 10,000 points, not to speak of 2,000,000.

What you could try is dynamically requesting the dataset from a custom server (which you'd have to set up), e.g.

 map = ...
 map.on('moveend', function(e) 
 getGeoJson(e);
 );
 map.on('zoomend', function(e) 
 getGeoJson(e);
 );
 map.setView([2,3], 2);

 function getGeoJson(event) 
 // todo determine current viewport
 $http.get('someGeoJsonDataProvider.someLanguage?currentView=[lat0,lon0,lat1,lon1]').then(function (resp) 
 // todo clear layers
 // new layer
 map.addLayer(
 L.geoJson(resp.data)
 );
 );
 

Your server would then calculate which points to return, depending on what the user wants to see right now. Depending on zoom factor and clipping, you will only need to return a very small percentage of points without worsening user experience.

Downsides: Setting up a server (you should find libraries for filtering the geo points) & slower rendering (after every zoom or drag, a server request needs to be made)

I had solutions to map out 50 to 100 million records, you need to use server-side solutions to do grid and dynamic based. You can not reply on web map APIs (Google,or others) to do client-side's rendering....

[http://96.231.36.9:8080/rbgis/google_map.html][1]
try the above links and see how