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

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

相关推荐
Alice-YUE1 分钟前
提示词工程:工业级 Prompt 写法与分层组装
java·开发语言·大模型·prompt·提示词工程·system prompt
可乐鸡翅yeah_12 分钟前
AES‑128 加密 M3U8,IV 初始化向量新手容易踩坑
前端·网络·数据库·ffmpeg·音视频·m3u8在线
MetWeave18 分钟前
机场天气的"广播系统":三种报文一次讲明白
前端
弹简特20 分钟前
【Java项目-企悦抽】17-抽奖模块02-抽奖接口实现
java·开发语言·状态模式·springboot
HEJOO928 分钟前
指针与结构体:C 语言进阶核心详解
c语言·开发语言·网络
乌暮32 分钟前
JVM 原理与实践:从运行时数据区到线上故障排查
java·开发语言·jvm·后端·学习·面试
xieter34 分钟前
【技术精选】深入浅出现代前端渲染与性能优化实践指南 (2026-10-04)
前端·javascript
计算机魔术师39 分钟前
Anthropic 密会宗教领袖谈 Claude 意识,OpenAI 为什么急眼
前端
xieter39 分钟前
【硬核实战】TypeScript Compiler API: Preserving Child Node Narrowing in Reusable Type Guards 🔧 (2026-10-03)
前端·javascript
xieter43 分钟前
【硬核实战】React 19 useFormStatus Returning False? I Built a SubmitButton That Fixes It (2026-10-03)
前端·javascript