简介EPSG:4326 和 EPSG: 3857

openlayers的使用中，通常有两种坐标系，即 EPSG:4326 和 EPSG: 3857 ，未指定的情况下，默认为 EPSG: 3857 。

EPSG:4326

EPSG:4326是一种地理坐标系，也被称为WGS84坐标系。它使用经度和纬度表示地球上的点位置，适合描述大范围的地理信息，单位是度。
这个坐标系常用于描述地理信息数据，如地图、GPS等。因为这种投影方式可以将地球表面展平成一个矩形，便于在网络上传输和显示地图瓦片。
数据格式：一般是这种的[22.37，114.05]；
坐标范围是-180到+180的经度和-90到+90的纬度。
特点：利于存储，可读性高。
缺点：会导致页面变形。

EPSG:3857

EPSG:3857是一种投影坐标系，也被称为Web墨卡托投影。它使用x和y坐标表示地球上的点位置，适合在Web环境下显示地图，单位是米。
通常用于 GPS 设备和地理标记（例如 Google Maps API 或 OpenStreetMap），因为它直接对应于地球表面的地理位置。
数据格式：一般是这种[12914838.35,4814529.9]；
坐标范围是-20026376.39到20026376.39（西经到东经），以及-20048966.10到20048966.10（南纬到北纬）。
对墨卡托投影来说，越到高纬度，大小扭曲越严重，到两极会被放到无限大，所以，墨卡托投影无法显示极地地区。WGS84范围：-180.0 ，-85.06，180.0， 85.06。
特点：用于分析，显示数据。
缺点：数据的可读性差和数值大存储比较占用内存。

在实际开发中，因为map源数据大部分都是EPSG:4326的数据源格式的数据，但是使用EPSG:4326的坐标系地图会出现被压缩的感觉。所以我们都是采用 EPSG:3857的坐标系类型，把数据源转换位 EPSG:3857的数据源即可。但是这个EPSG:3857数据源不易读取和值占内存原因，所有结合两者的缺点，我们采用坐标转换，即 EPSG:4326转 EPSG:3857。所有请理解这句话：通常：数据存储在EPSG:4326中，显示在EPSG:3857中。

openlayers的代码中涉及到投影坐标的位置

view中设置投影

在 openlayers 中创建map时候会有个view 属性，projection 属性指定坐标系的类型，一般是4326和3857两种。

view属性下面会存在一个center属性。这个属性就是设置中心位置的坐标。需要根据坐标系类型设置值，单位要对应上，度还是米。

new View({
    projection:'EPSG:3857',//坐标系类型，默认是'EPSG:3857'
              //还可设置为'EPSG:4326'
    center: fromLonLat([104.912777, 34.730746]), //地图中心坐标,
                                    //  数组中 第一个值表示经度值，第二个值是纬度值
});

使用useGeographic()，以下两段代码效果是等价的

import { useGeographic } from "ol/proj.js"; 
useGeographic();

view: new View({
        center: [0, 0],
        zoom: 2,
        projection: "EPSG:4326",
      }),

坐标转换方法

从 EPSG:4326 转换到 EPSG:3857：

const lonlat = [10, 20];
const webmercator = ol.proj.transform(lonlat, 'EPSG:4326', 'EPSG:3857');

从 EPSG:3857 转换到 EPSG:4326：

const webmercator = [1234567, 2345678];
const lonlat = ol.proj.transform(webmercator, 'EPSG:3857', 'EPSG:4326');

加载geojson文件时的坐标设置

dataProjection是源坐标系,即要绘制的geojson中存放的坐标的坐标系统. featureProjection是目标地图视窗的坐标系统,即目标坐标系.

目标坐标系为 4326:

var vectorSource = new ol.source.Vector({
features: (new ol.format.GeoJSON()).readFeatures(geojsonObject, { 
dataProjection: 'EPSG:4326',
featureProjection:'EPSG:4326' })
});

目标坐标系为 3857:

var vectorSource = new ol.source.Vector({
features: (new ol.format.GeoJSON()).readFeatures(geojsonObject, { 
dataProjection: 'EPSG:4326',
featureProjection:'EPSG:3857' })
});

transform和toLonLat的区别

有关坐标转换的包都在ol/proj中，其中EPSG:3857和EPSG:4326坐标系之间的转换有transform、fromLonLat、toLonLat
fromLonLat是将EPSG:4326转换为EPSG:3857；
toLonLat是将EPSG:3857转换为EPSG:4326

transform的转换和toLonLat的区别是：transform转换之后的经度可能是几千，而toLonLat转换之后的经度位于[-180, 180]之间。
因为地图是不断拓展的，一个地方一直往右拖，同一个地方的经度是±360的变化

//3857=>4326
let coordinate = transform(
  evt.coordinate,
  "EPSG:3857",
  "EPSG:4326"
)
let x = coordinate[0];
let flag = (x + 180) % 360;
if(flag > 0) {
  flag -= 180;
} else {
  flag += 180;
}
coordinate[0] = flag;

//等价于
let coordinate = toLonLat(evt.coordinate);

openlayers使用的坐标系