源码分析之Leaflet中坐标参考系CRS对象

最新推荐文章于 2025-04-27 22:34:27 发布

Jinuss

最新推荐文章于 2025-04-27 22:34:27 发布

阅读量476

点赞数 9

分类专栏： Leaflet 源码文章标签： Leaflet 前端

本文链接：https://blog.csdn.net/m0_46281382/article/details/147469229

版权

源码同时被 2 个专栏收录

101 篇文章

订阅专栏

Leaflet

40 篇文章

订阅专栏

概述

CRS 是 Coordinate Reference System 的缩写，即坐标参考系统

Leaflet 中CRS 是一个对象，它包含了一些方法，定义了地图坐标地理坐标之间的转换规则，如将经纬度坐标转换为像素坐标，以及将像素坐标转换为经纬度坐标，是地图渲染和交互的核心。

源码分析

源码实现

CRS的源码实现如下：

export var CRS = {
  latlngToPoint: function (latlng, zoom) {
    var projectedPoint = this.projection.project(latlng), // 经纬度 -> 平面坐标
      scale = this.scale(zoom); // 当前缩放比例

    return this.transformation._transform(projectedPoint, scale); // 应用变换
  },
  pointToLatLng: function (point, zoom) {
    var scale = this.scale(zoom),
      untransformedPoint = this.transformation.untransform(point, scale);

    return this.projection.unproject(untransformedPoint);
  },
  project: function (latlng) {
    return this.projection.project(latlng);
  },
  unproject: function (point) {
    return this.projection.unproject(point);
  },
  scale: function (zoom) {
    return 256 * Math.pow(2, zoom);
  },
  zoom: function (scale) {
    return Math.log(scale / 256) / Math.LN2;
  },
  getProjectedBounds: function (zoom) {
    if (this.infinite) {
      return null;
    }

    var b = this.projection.bounds,
      s = this.scale(zoom),
      min = this.transformation.transform(b.min, s),
      max = this.transformation.transform(b.max, s);

    return new Bounds(min, max);
  },
  infinite: false,
  wrapLatLng: function (latlng) {
    var lng = this.wrapLng
        ? Util.wrapNum(latlng.lng, this.wrapLng, true)
        : latlng.lng,
      lat = this.wrapLat
        ? Util.wrapNum(latlng.lat, this.wrapLat, true)
        : latlng.lat,
      alt = latlng.alt;

    return new LatLng(lat, lng, alt);
  },
  wrapLatLngBounds: function (bounds) {
    var center = bounds.getCenter(),
      newCenter = this.wrapLatLng(center),
      latShift = center.lat - newCenter.lat,
      lngShift = center.lng - newCenter.lng;

    if (latShift === 0 && lngShift === 0) {
      return bounds;
    }

    var sw = bounds.getSouthWest(),
      ne = bounds.getNorthEast(),
      newSw = new LatLng(sw.lat - latShift, sw.lng - lngShift),
      newNe = new LatLng(ne.lat - latShift, ne.lng - lngShift);

    return new LatLngBounds(newSw, newNe);
  },
};