mapboxgl

您所在的位置:网站首页 mapboxgl加载gltf mapboxgl

mapboxgl

2024-07-03 05:16| 来源: 网络整理| 查看: 265

下面的代码可以在我的Github中找到:https://github.com/QingyaFan/data-visualization

先说结论:不可行。具体原因如下。

以后的文章我们将不仅仅局限于Openlayers,适合业务的技术才是好的技术,有的功能其他的库实现的比Openlayers好,我们也会聊,比如这次的mapboxgl。这个也源于Openlayers对于WebGL支持的缓慢进度:Openlayers憋了好久,终于憋出了WebGL的渲染器,然而只支持点要素类型,要是线和面类型的要素,数据量级一上去,就没法用了。我们看看隔壁的Mapboxgl,诞生之日起就是WebGL渲染,而且openlayers新出的WebGLPoint Layer使用的WebGL渲染样式规则也借鉴了Mapboxgl的表达式(Expression)。所以,为什么不用mapboxgl呢?当我想到这个想法的时候,真香定理仿佛在向我招手。于是我掏出压箱底的321万的线要素数据 ⚡️ 来一场硬核的测试。

线要素321万

1、初始化一幅地图

Mapbox的一些理念和Openlayers不太一样,在使用之前,我们要看有哪些异同。

Mapbox中数据源(Source)不从属于图层(Layer),而是直接由Map对象管理 Layer可以选择要渲染的Source,所以我们很自然想到,是否可以多个Layer使用一个Source呢?当然可以!Openlayers中也可以,只不过我们之前没那么做过 Mapbox中样式是Paint表示,Openlayers中是Style 在用321万的数据之前,我们先来一波常规操作,用19万的全球城市点数据熟悉一下mapbox的流程:

let url = 'http://localhost:8000/world-cities.geojson'; this.map.addSource('cities-population', { type: 'geojson', data: url }); this.map.addLayer({ 'id': 'cities-population', 'type': 'circle', 'source': 'cities-population', 'paint': { 'circle-radius': [ "interpolate", ["linear"], ["get",


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3