WebGIS開發(fā)中不同坐標系坐標轉(zhuǎn)換問題解決基本步驟

更新時間：2025年01月17日 09:40:58 作者：喆喆code

這篇文章主要介紹了如何在JavaScript中使用proj4庫進行坐標系轉(zhuǎn)換的基本步驟,包括安裝、示例、自定義坐標系定義、擴展以及一些常見EPSG代碼對照表,需要的朋友可以參考下

前言

在 JavaScript 中，使用 proj4 庫進行坐標系轉(zhuǎn)換是一個非常常見的操作。proj4 是一個支持多種坐標系的 JavaScript 庫，提供了從一種坐標系到另一種坐標系的轉(zhuǎn)換功能。

以下是使用 proj4 進行坐標系轉(zhuǎn)換的基本步驟：

1. 安裝 proj4

你可以通過 npm 或直接引入 CDN 使用 proj4。

通過 npm 安裝：

npm install proj4

通過 CDN 引入：

<script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.8.1/proj4.js"></script>

2. 示例：WGS84 轉(zhuǎn)換為 Web Mercator

WGS84 是一個全球通用的地理坐標系（經(jīng)緯度），而 Web Mercator 通常用于網(wǎng)絡地圖（比如 Google Maps、OpenStreetMap）。

以下是代碼示例：

// 導入 proj4 (如果通過 CDN 引入，則不需要這行代碼)
const proj4 = require('proj4');

// 定義坐標系
const WGS84 = 'EPSG:4326'; // WGS84 坐標系
const WebMercator = 'EPSG:3857'; // Web Mercator 坐標系

// 定義一個點的經(jīng)緯度
const point = [116.397128, 39.916527]; // 北京天安門經(jīng)緯度

// 轉(zhuǎn)換坐標
const convertedPoint = proj4(WGS84, WebMercator, point);

console.log('轉(zhuǎn)換后的坐標:', convertedPoint);

3. 自定義坐標系

如果你需要轉(zhuǎn)換到某個自定義坐標系，可以通過 proj4 的 proj4.defs 定義。

示例：定義一個 CGCS2000 坐標系

// 定義 CGCS2000 (EPSG:4490)
proj4.defs("EPSG:4490", "+proj=longlat +datum=CGCS2000 +no_defs");

// 從 WGS84 轉(zhuǎn)換到 CGCS2000
const point = [116.397128, 39.916527]; // 北京天安門經(jīng)緯度
const convertedPoint = proj4('EPSG:4326', 'EPSG:4490', point);

console.log('CGCS2000 坐標:', convertedPoint);