简体   繁体   中英

Can´t sync map OpenLayers Angular

I'm trying to create a component with drag-drop with this library, but Angular doesn't recognize a library. ts-lint shows me the following code.

Could not find a declaration file for module 'ol-hashed'. 'C:/Users/ivangm/Desktop/openlayers-workshop/node_modules/ol-hashed/index.js' implicitly has an 'any' type.
  Try `npm i --save-dev @types/ol-hashed` if it exists or add a new declaration (.d.ts) file containing `declare module 'ol-hashed';`

However, if I test the code in a pure nodejs application, I don't get this problem

My component is:

import 'ol/ol.css';

import { Component, OnInit } from '@angular/core';
import sync from 'ol-hashed';
import GeoJSON from 'ol/format/GeoJSON';
import DragAndDrop from 'ol/interaction/DragAndDrop';
import VectorLayer from 'ol/layer/Vector';
import Map from 'ol/Map';
import VectorSource from 'ol/source/Vector';
import View from 'ol/View';


@Component({
  selector: 'app-drag-drop',
  templateUrl: './drag-drop.component.html',
  styleUrls: ['./drag-drop.component.scss']
})
export class DragDropComponent implements OnInit {
  map = new Map({});

  constructor() { }

  ngOnInit(): void {
    this.map = new Map({
      target: 'map-container2',
      view: new View({
        center: [0, 0],
        zoom: 2
      })
    });
    sync(this.map);
    const source = new VectorSource();
    const layer = new VectorLayer({ source });
    this.map.addLayer(layer);
    this.map.addInteraction(new DragAndDrop({
      source,
      formatConstructors: [GeoJSON as any]
    }));
  }
}

And my package-json is:

{
  "dependencies": {
    ...
    "ol": "^6.5.0",
    "ol-hashed": "^2.0.0",
  },
  "devDependencies": {
    ...
    "@types/ol": "^6.4.2",
    "parcel-bundler": "^1.12.5",
  }
}

I found the solution, I leave it here commented in case someone serves you in the future.

sync() isn't required to work with this library in Angular. So I remove this line and the import and map works.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM