在前端中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);

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

相关推荐
Dilettante2581 天前
React Server Components 全链路解析:Next.js 构建产物、导航流程与 Payload 格式
前端·next.js
前端付豪1 天前
Nest 项目小实践之注册登陆
前端·node.js·nestjs
用户9121917620611 天前
日本股票K线图生成实战:基于API的完整对接方案
前端
牛奶1 天前
JS随笔:ES6+特性与模块化实践
前端·javascript
牛奶1 天前
JS随笔:基础语法与控制结构
前端·javascript
天蓝色的鱼鱼1 天前
Node.js 中间层退潮:从“前端救星”到“成本噩梦”
前端·架构·node.js
货拉拉技术1 天前
如何用 AI 做业务级 Code Review
前端·agent·前端工程化
李剑一1 天前
前端圈子又出新东西了,大幅提升解析速度。尤雨溪推荐,但我不太推荐
前端
前端Hardy1 天前
HTML&CSS&JS:基于定位的实时天气卡片
javascript·css·html
青屿ovo1 天前
Vue前端页面版本检测解决方案
前端·vue.js