Render 2500 geoJSON polygons onto a leaflet map(将 2500 个 geoJSON 多边形渲染到传单地图上)
问题描述
我一直在寻找,但似乎找不到解决方案.
I've been searching but cannot seem to find a solution.
我有一个 170mb 大小的 GeoJSON 文件.它包含大约 2500 个多边形.不知何故,我需要将它渲染到传单地图.显然我没有机会.
I have a GeoJSON file which is 170mb in size. It contains about 2500 polygons. Somehow I need to render it to a leaflet map. Evidently at that size I have no chance.
呈现这些数据的最简单方法是什么?我是否能够创建一个完整的透明 png,它可以简单地呈现在世界地图上.巨大的尺寸是由于复杂性和多边形的数量.在这一点上,我不需要它是交互式的.
What will the easiest way to render this data? Am I able to create a complete transparent png which can simply be rendered over the world map. The huge size is due to the complexity and the number of polygons. At this point I don't need it to be interactive.
谢谢,布赖恩
推荐答案
最简单的方法是根据这些数据创建自己的地图图块.有几种方法可以实现,但我的建议是您使用 TileMill.它是免费的,而且非常易于使用.所以,基本上你会:
The easiest way is to create your own map tiles based on that data. There are a couple of ways of achieving this but my suggestion is that you use TileMill. It's free and very easy to use. So, basically you would:
使用 TileMill 并将您的 GeoJSON 文件指定为数据源
Use TileMill and specify your GeoJSON file as the data-source
在 TileMill 中使用特殊的类似 CSS 的语言配置地图的显示方式(如多边形的颜色)
Configure how the map should be displayed (like the color of the polygons) with a special CSS-like language inside TileMill
生成图块
在您的 Leaflet 地图中加载一个新的 TileLayer 以引用您的文件
Load a new TileLayer in your Leaflet map that references your files
实际上我前段时间写过一个使用 .shp 而不是 GeoJson 的教程,但应该足够相似:
I've actually written a tutorial some time ago that uses a .shp instead of a GeoJson, but should be similar enough:
http://build-failed.blogspot.pt/2012/03/custom-map-tiles-part-2-tilemill.html
这篇关于将 2500 个 geoJSON 多边形渲染到传单地图上的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:将 2500 个 geoJSON 多边形渲染到传单地图上
基础教程推荐
- 直接将值设置为滑块 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01