Question

我正在尝试使用带有开放图层的反应js在地图中绘制一些矩形形状。但是，我收到一个错误，因为＆＃34;无法读取属性＆＃39; Vector＆＃39;未定义＆＃34; /＆＃34;无法阅读财产＆＃39; Draw＆＃39;未定义＆＃34;。

导入所有必要的类后，我收到错误。请参阅两条评论之间的代码。

代码：

import React, { Component } from "react";
import ReactDOM from "react-dom";
import 'ol/ol.css';
import ol from 'ol';
import Map from 'ol/map';
import View from 'ol/view';
import Tile from 'ol/layer/tile';
import OSM from 'ol/source/osm';
import proj from 'ol/proj';
import Vector from 'ol/source/vector';
import Draw from 'ol/interaction/draw';

class MapComponent extends Component {

  componentDidMount() {
    var map = new Map({
      target: 'map',
      layers: [
        new Tile({
          source: new OSM()
        })
      ],
      view: new View({
        center: proj.fromLonLat([37.41, 8.82]),
        zoom: 4
      })
    })

  //To draw Rectangle in Map - Begins
    var source = new ol.source.Vector({wrapX: false});
    var geometryFunction = ol.interaction.Draw.createRegularPolygon(4);

    var draw = new ol.interaction.Draw({
      source: source,
      type: 'Square',
      geometryFunction: geometryFunction
    });
    map.addInteraction(draw);
 //To draw Rectangle in Map - Ends
  }
  render() {

    return (
      <div id="map"></div>

    )
  }
}

export default MapComponent;

截图：

Answer 1

您正在导入Vector和Draw，但使用ol.source.Vector来使用它们。

取而代之的是：

var source = new ol.source.Vector({wrapX: false});

使用：

var source = new Vector({wrapX: false});

同样适用于Draw。

无法阅读财产＆＃39; Vector＆＃39; /＆＃39; Draw＆＃39;在React JS中未定义

1 个答案: