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

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

相关推荐
code2cat2 小时前
Java进阶篇之AtomicReferenceFieldUpdater:用不可变快照替换整份状态
java·开发语言·cas
Nathan__272 小时前
PHP面试题——情景应用
开发语言·php
geats人山人海2 小时前
现代c++2.4 虚继承
java·开发语言·c++
bmxy小明同学3 小时前
2026-10-11-幻觉治理
服务器·前端·javascript
我命由我123453 小时前
Android 广播 - 组件通信
android·java·开发语言·android studio·android jetpack·android-studio·android runtime
前端 贾公子3 小时前
LangGraph == 图的状态(State)管理 (中)
开发语言·数据库·python
Coder_张三3 小时前
iOS 26 适配
前端·ios·swift
m0_587383003 小时前
无人自助拼豆系统落地开发实战指南 核心逻辑实现与部署经验分享
前端·javascript·vue.js·人工智能·经验分享·需求分析
zhaiyy3 小时前
HTML Popover API 实践
前端·javascript·html
李福春4 小时前
斗破Google ADK Java苍穹-第2境斗者-凝旋筑基-Java环境
java·开发语言·gemini·llmagent·深圳同盟·腾讯云架构师技术同盟·adk java