Угловые и миграционные открытые слои в ol & proj4js - PullRequest
Новая
       61

Угловые и миграционные открытые слои в ol & proj4js

0 голосов
/ 06 сентября 2018

Попытка перенести проект на основе углов с использованием openlayers от устаревшего openlayers-npm-package до рекомендуемого ol-npm-package . Отладкой я понял, что у меня проблема с ранее работающей интеграцией proj4 .

После двух дней использования различных подходов, пробуя то и это, осознавая, что в этой специальной комбинации библиотек проблема, похоже, возникает из-за отсутствия типизаций для нового ol-пакета.

То, что я теперь могу подтвердить - и надеюсь, что это поможет другим (я не могу комментировать SO-Answer пока) - то, что поддержка proj4 еще не существует в @ типах /ol:'4.6.2', но в @ types / openlayers: '^ 4.6.12' .

Таким образом, использование proj4 для предоставления различных проекций для открытых слоев с использованием зависимостей 

"ol": "5.2.0",
"@types/openlayers": "4.6.12",

будет работать для следующего фрагмента кода, но ol в сочетании с @types/ol не будет:

импорт 

import * as ol from 'openlayers';
import * as proj4x from 'proj4';
const proj4 = (proj4x as any).default;
proj4.defs([
  [ 'EPSG:25832', '+proj=utm +zone=32 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs' ],
    ...
]);

Конструктор 

ol.proj.setProj4(proj4);

Ответы [ 2 ]

0 голосов
/ 23 сентября 2018

OpenLayers 5 больше не имеет метода setProj4, а вместо этого использует метод регистра в модуле ol / proj / proj4 .Итак, я последовал за решением @ user10324080, а также обсудил здесь и пришел к следующему решению с Angular 6:

  1. Добавил следующие строки в конец CompilerOptions вфайл tsconfig.js:

    "allowSyntheticDefaultImports": true, "esModuleInterop":true

  2. Я создал файл @types/ol/proj/proj4.d.ts и добавил в него:

    export function register(proj4: any): void;

  3. В файл .ts, где была создана карта, я добавил:

    import { fromLonLat } from 'ol/proj.js' import {register as proj4register } from 'ol/proj/proj4' import proj4 from 'proj4'; proj4.defs([[ 'EPSG:3067', '+proj=utm +zone=35 +ellps=GRS80 +units=m +no_defs']]); // Constuctor: proj4register(proj4); // ngOnInit: var view = new View({ projection: 'EPSG:3067', center: fromLonLat([27.47, 64.88], 'EPSG:3067'), zoom: 5 });

Я установил следующие версиибиблиотек и определений типов: 

"ol": "^5.2.0",
"proj4": "^2.5.0",
"@types/ol": "^4.6.2",
"@types/proj4": "^2.3.4"
0 голосов
/ 13 сентября 2018

Пытаясь полностью избежать @ types / openlayers и прибегнуть к @ types / ol, я в итоге придумал следующее:

package.json 

"dependencies": {
    ...
    "proj4": "2.4.4",
    ...

app /.../@ types / ol / proj / proj4.d.ts (вручную создал еще один файл типа в папке приложения) 

export namespace ol {
    namespace proj {
        function setProj4(proj4: any): void;
    }
}

импорт и определения, например, в. компонент 

import proj from 'ol/proj';
import * as proj4x from 'proj4';
const proj4 = (proj4x as any).default;
// Two example-projections (2nd is included anyway)
proj4.defs([
    [ 'EPSG:25832', '+proj=utm +zone=32 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs' ],
    [ 'EPSG:4326',  '+proj=longlat +datum=WGS84 +no_defs' ]
]);

в конструкторе - наконец регистрация proj4 с помощью ol 

proj.setProj4(proj4);
...