OpenLayer對容器Map自定義座標系

時間 2020-12-25

標籤 npm this url spa code blog 字符串 get 欄目 HTTP/TCP 简体版

原文原文鏈接

OpenLayer原則上只支持EPSG:4326和EPSG:3857，其中EPSG:3857是建立容器時，若是不聲明，默認使用的座標系，那麼若是須要別的座標系的話，就須要本身定義和配置，npm

通常狀況下，自定義座標系都是能夠在EPSG.IO上面找到對應的EPSG所對應的詳細參數this

下面時配置方法url

一、引入Proj4.jsspa

npm i proj4   //npm安裝proj4

二、定義座標系（以使用EPSG:4490爲例）code

  import proj4 from "proj4";
  import {register} from "ol/proj/proj4";
  import Projection from "ol/proj/Projection";
  import Map from "ol/Map";
  import View from "ol/View";
  import {defaults as defaultControls} from "ol/control.js";


     /**
       * 自定義座標系
       * @returns {Projection}
       */
      definedProjection() {
        // proj4.defs("EPSG:4528", "+proj=tmerc +lat_0=0 +lon_0=120 +k=1 +x_0=40500000 +y_0=0 +ellps=GRS80 +units=m +no_defs");
        proj4.defs("EPSG:4490", "+proj=longlat +ellps=GRS80 +no_defs");
        register(proj4);
        let projection = new Projection({
          code: 'EPSG:4490',
          extent: [-180, -90, 180, 90],
          units: 'degree'
        });
        return projection;
      },

    initMap(_id, url, EPSG) {
        let me = this
        let proj4490 = this.definedProjection()
        let map = new Map({
          controls: defaultControls({
            attribution: false,
            zoom: false,
          }),
          target: _id,
          view: new View({
            center: [118.807771, 31.920277],
            zoom: 10.864044262699636,
            projection: proj4490,
            extent: [-180, -90, 180, 90]
          }),
        });
    }