在前端中Proj4.js使用简单介绍

Proj4 是一个用于处理 JavaScript 里的几何图形和坐标计算的库。虽然这个库的知名度不如其他几何处理库如 Turf.js,但它提供了用于多边形、点、线等几何对象的计算功能,类似于 GIS(地理信息系统)的某些功能。

一、基础知识

在使用Proj4之前,可以了解一下投影的相关定义,可以参考下面网站:
https://epsg.io/
http://spatialreference.org

二、Proj4js引用

前端添加Proj4js有三种方式:

1、从http://trac.osgeo.org/proj4js/wiki/Download下载,获取产品包中dist/proj4.js文件。

2、引入CDN上的Proj4js:https://cdnjs.com/libraries/proj4js

3、本地有Node.js,可以直接使用npm install proj4进行安装。

三、Proj4的简单使用

proj4.js中预定义了三个坐标系,其他的坐标系则需要自己定义了,下面以从WGS84(4326)到Web墨卡托(3857)的转换为例

复制代码
    const wgs84 = 'EPSG:4326';
    const webMercator = 'EPSG:3857';
    const pointWGS84 = [12.4924, 41.8902];  
    const pointWebMercator = proj4(wgs84, webMercator, pointWGS84);
    console.log(pointWebMercator);

更多的使用情况,带挖掘!!!

相关推荐
云浪3 分钟前
手把手教你用 fetch 读取 SSE 流,给 AI 聊天加上打字机效果
前端·javascript·vue.js
Csvn14 分钟前
Tailwind 动态拼接类名失效?JIT 引擎正在"静态分析"你
前端
Hanniel18 分钟前
Python描述符(下):内置机制揭秘
开发语言·python·机器学习
柳杉23 分钟前
我用Threejs 搓了一个 3D 中国地图设计器,开箱即用
前端·three.js·数据可视化
Cloud_Shy61824 分钟前
解读《Effective Python 3rd Edition》:从练气到老魔(第七章 Item 52 - 53)
开发语言·人工智能·笔记·python
DJ斯特拉24 分钟前
Tlias智能学习辅助系统(前端部分)
前端·javascript·学习
星恒随风25 分钟前
C++ string 类详解:常用接口、OJ 场景与模拟实现中的深浅拷贝
开发语言·c++·笔记·学习·状态模式
码云数智-大飞26 分钟前
Go Channel 详解:并发通信的正确姿势
前端·数据库·git