WebGIS笔记

2023-12-31

字数统计: 1.1k字 | 阅读时长: 4分

Leaflet的简单地图搜索展示地址：https://gitxieada.github.io/Demo/gis/leaflet/index.html
L7 Demo-全球空气质量指数（AQI）：使用L7-AntV，可视化全球空气质量指数，鼠标移入展示质量详情。
展示地址：https://gitxieada.github.io/Demo/gis/L7/index.html

GIS基础知识

参考文章：
前后端都要懂一点的 GIS https://www.yuque.com/datav/datav-cool/swteb8
从零打造一个Web地图引擎 https://www.cnblogs.com/wanglinmantan/archive/2022/01/18/15820181.html
GIS调研 https://github.com/hanhaife/hanhai.github.io/issues/4
DataV.GeoAtlas地理小工具系列
DataV.GeoAtlas 使用文档 https://www.yuque.com/datav/datav-cool/ssq6nk
L7Editor(AntV 团队基于 L7 生态推出的在线地理数据可视化工具) https://l7editor.antv.antgroup.com/guide
百度坐标系说明 https://lbsyun.baidu.com/skins/MySkin/resources/iframs/coordinate.html

坐标系

国际通用标准为，WGS-84作为国际通用坐标系，EPSG:3857作为web展示用。
墨卡托坐标系：代号为 EPSG:4326，现在国际上习惯称为 WGS-84 （GPS）。
伪墨卡托坐标系：代号为 EPSG:3857，由google在2008年提出，目的是统一 web地图展现形式。

WGS84：为一种大地坐标系，也是目前广泛使用的GPS全球卫星定位系统使用的坐标系。
GCJ-02 坐标系：又称火星坐标系，由国家测量局在2002年制定，国家规定，市面上发布的任何地图产品，都不允许直接使用GPS（WGS-84）坐标系，必须在WSG-84的基础上使用GCJ-02进行至少一次加密。并且加密过程不可逆。百度、搜狗坐标系都是在GCJ-02上二次加密得到，高德则直接使用GCJ-02。使用GCJ-02坐标系时，必须搭配符合 GCJ-02 的图源（只要国内合法发布的图源都符合这个标准），配合国内坐标，就可以在地图画出真实的点，反之，使用GPS坐标画在国内图源的话，则会出现100-200米的漂移。
BD09：为百度坐标系，在GCJ02坐标系基础上再次加密。其中bd09ll表示百度经纬度坐标，bd09mc表示百度墨卡托米制坐标。

图源

图源一般分为：png瓦片图、矢量瓦片图
得益于伪墨卡托正方形无限分割的特性，产生了分级瓦片图，一般民用最高缩放级别 18 级，主流的是采用 png 格式的分级瓦片图。

GeoJSON

GeoJSON 是一种对各种地理数据结构进行编码的格式。GeoJSON对象可以表示几何、特征或者特征集合。GeoJSON支持下面几何类型：点、线、面、多点、多线、多面和几何集合。GeoJSON里的特征包含一个几何对象和其他属性，特征集合表示一系列特征。

L7-AntV

参考文章：
快速上手 | L7 https://l7.antv.antgroup.com/tutorial/quickstart
「AntV」L7地理可视化：从入门到实践 https://www.cnblogs.com/jiujiubashiyi/p/17476433.html
「AntV」全球AQI数据获取与L7可视化 https://www.cnblogs.com/jiujiubashiyi/p/17468072.html
瓦片地图服务在线资源访问总结 https://www.cnblogs.com/HandyLi/p/11137367.html

L7 是由蚂蚁金服 AntV 数据可视化团队推出的基于 WebGL 的开源大规模地理空间数据可视分析开发框架。L7 中的 L 代表 Location，7 代表世界七大洲，寓意能为全球位置数据提供可视分析的能力。L7 以图形符号学为理论基础，将抽象复杂的空间数据转化成 2D、3D 符号，通过颜色、大小、体积、纹理等视觉变量实现丰富的可视化表达。

Leaflet

展示地址：https://gitxieada.github.io/Demo/gis/leaflet/index.html
Leaflet官网 https://leafletjs.com/index.html

Leaflet.js 是一个开源的 JavaScript 库，用于创建交互式地图和地理信息应用程序。它提供了一个简单、轻量级且易于使用的 API，让开发者可以在网页上集成地图、标记点、图层、多边形、折线等地理信息要素，并实现与地图相关的交互和操作。

leaflet添加高德瓦片地图，不用coordtransform或gcoord坐标纠偏

demo项目参考:
React+高德+Leaflet的简单地图搜索：
https://juejin.cn/post/7208858443630624828
https://github.com/kingOfSoySauce/Map-search-of-React-Gaud-Leaflets