4

I exported some countries as a single .geojson file. The file includes every country's vertices and coordinates, as that's what a .geojson is ─ a vector file.

Thing is, there are about 20 countries and considering each of them are 100-120 sided polygons, it's not surprising that the file size is +100 MB.

Leaflet has a geojson class that performs a geojson overlay for points, polygons etc. that reads the vector file and displays it on the map.

Since I want to post this .geojson file on the web using Leaflet, making every user download 100 MB for this is out of the question. Apart from that, when I tested this Leaflet map on my computer using Chrome, it takes about 5 seconds each time I zoom in/out for the map to come to resolution (the map crashes for 5 seconds because the webpage becomes unresponsive due to this vector file workload). I suppose pulling 100 MB from the RAM each time somebody zooms would be hard for just about any computer.

Is there any way to create a .png file of each country instead and overlay that onto the Leaflet map? I suppose that would greatly reduce file size and dramatically improve map performance.

  • 2
    Web map service seems like an option - render using mapnik or similar, serve via mapnik or geoserver or mapserver. 100MB does seems like a lot for what you are describing though. Lets say it is 200 points for each polygon, and you have 20 of them, that is 4000 points, or 25 Kb per point. Something is wrong... – BradHards Dec 28 '13 at 10:23
  • It's not unrealistic @BradHards if OP is downloading all the data for each country. The osh.pbf full history file for Nepal has over 3,500,000 nodes. I know because my MacBook spent the last 10 hours parsing it to PostgreSQL :D – Max von Hippel Oct 25 '16 at 5:12
  • 1
    @MaxvonHippel : Not disputing that OSM has a lot of data, but the original poster says 100-120 sided polygons for 20 countries. That didn't sound a full OSM PBF, more like just a boundary (country border), but it still doesn't really hold together. – BradHards Oct 25 '16 at 6:02
7

If you want to show your geometries as vectors instead of images there are a couple of tricks that you can apply to reduce the load of your page:

If you really want to go with raster/images/tiles take a look at TileMill.

  • 1
    Sorry for taking it so long to reply, while it took me an entire week to understand and work with TopoJSON. When converted GeoJSON to TopoJSON, and converted it backwards on the client's browser, the file got pretty messed up: my attributes and styling was gone. But that's another matter of fact while my 70 MB file is now reduced to 5,6 MB. – Doruk Karınca Feb 3 '14 at 1:51
  • That's right. AFAIK currently leaflet does not support topojson out of the box so you should convert it back. github.com/saintsjd/imi-leaflet-topojson It will be nice to have a plugin that can "draw" topojson with out convert it. – Francisco Puga Feb 3 '14 at 10:27
  • Is there any other plugin doing the same thing? Because I doubt the plugin is stable, while their html demo is not working.. Now that I am using TopoJSON now, I have asked another question here that is better addressing the performance issue. – Doruk Karınca Feb 22 '14 at 1:30
1

There is a good answer in Google Groups by Nelson Minar:

There is another D3+Leaflet solution by Mike Bostock, though it needs some handwork to get going.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.