前端 Proj4.js 使用指南：基础安装与 iClient 进阶应用

引言

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);

更多应用场景，敬请期待后续挖掘！

附：进阶应用

上述示例仅展示了坐标转换功能，实际上 Proj4js 在 iClient 中还有其他用途。最后介绍一种在 iClient for Openlayers 中读取非 4326 或 3857 坐标系地图数据的方法。

例如获取到的地图数据显示目标坐标系为 EPSG:3395。

如何利用 iClient for Openlayers 直接浏览此类数据？

1、计算分辨率（采用固定写法）

2、定义 3395 坐标系，并配置地图范围

3、使用 Tile 组件展示地图

总结

至此，关于前端中 Proj4.js 的使用介绍及进阶应用文章结束。如需了解更多前端 Proj4.js 相关内容，请查阅本站往期文章或继续浏览下文，感谢大家的支持！