OpenLayers 5 绘制交互 - "n is not a constructor" 在 Draw.js:338
OpenLayers 5 draw interactions - "n is not a constructor" at Draw.js:338
我正在尝试允许用户绘制和修改功能,遵循这个示例:https://openlayers.org/en/v5.3.0/examples/draw-and-modify-features.html - 但我收到两个错误:
Uncaught TypeError: n is not a constructor
at e.r [as geometryFunction_] (Draw.js:338)
at e.startDrawing_ (Draw.js:700)
at e.handleUpEvent (Draw.js:570)
at e.handleEvent (Pointer.js:132)
at e.handleEvent (Draw.js:524)
at e.handleMapBrowserEvent (PluggableMap.js:933)
at e (events.js:41)
at e.dispatchEvent (Target.js:101)
at e.handlePointerUp_ (MapBrowserEventHandler.js:166)
at e (events.js:41)
和
Uncaught TypeError: Cannot read property 'getGeometry' of null
at e.modifyDrawing_ (Draw.js:717)
at e.handlePointerMove_ (Draw.js:618)
at e.handleEvent (Draw.js:518)
at e.handleMapBrowserEvent (PluggableMap.js:933)
at e (events.js:41)
at e.dispatchEvent (Target.js:101)
at e.relayEvent_ (MapBrowserEventHandler.js:279)
at e (events.js:41)
at e.dispatchEvent (Target.js:101)
at e.fireNativeEvent (PointerEventHandler.js:397)
当我单击开始绘制要素时,第一个错误出现在控制台中。然后蓝点停留在同一个位置,当我四处移动鼠标时,第二个错误反复触发。第一次点击后点击地图将不会执行任何操作。
我在 Draw.js 中看不到任何明显的东西,据我所知,我的代码完全相同,除了一些小的调整以适应我的应用程序,如示例 I如上所述。
我正在使用 OpenLayers 5.3.0,我正在通过 rawgit 加载它:
<link rel="stylesheet" href="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/css/ol.css" type="text/css">
<script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>
我的代码的其他相关部分如下 - 改编自上述示例:
var drawSource = new ol.source.Vector();
var drawVector = new ol.layer.Vector({
source: drawSource,
style: new ol.style.Style({
fill: new ol.style.Fill({
color: 'rgba(255, 255, 255, 0.2)'
}),
stroke: new ol.style.Stroke({
color: '#ffcc33',
width: 2
}),
image: new ol.style.Circle({
radius: 7,
fill: new ol.style.Fill({
color: '#ffcc33'
})
})
})
});
map.addLayer(drawVector);
var modify = new ol.interaction.Modify({source: drawSource});
map.addInteraction(modify);
var draw, snap; // global so we can remove them later
function removeInteractions() {
map.removeInteraction(draw);
map.removeInteraction(snap);
}
function addInteractions() {
draw = new ol.interaction.Draw({
source: drawSource,
type: ol.geom.Polygon
});
map.addInteraction(draw);
snap = new ol.interaction.Snap({source: drawSource});
map.addInteraction(snap);
}
我正在通过超链接调用 addInteractions() 和 removeInteractions()。在我调用 addInteractions() 之前或在我调用 removeInteractions() 之后没有出现错误。
绘制类型应为字符串
draw = new ol.interaction.Draw({
source: drawSource,
type: 'Polygon'
});
我正在尝试允许用户绘制和修改功能,遵循这个示例:https://openlayers.org/en/v5.3.0/examples/draw-and-modify-features.html - 但我收到两个错误:
Uncaught TypeError: n is not a constructor
at e.r [as geometryFunction_] (Draw.js:338)
at e.startDrawing_ (Draw.js:700)
at e.handleUpEvent (Draw.js:570)
at e.handleEvent (Pointer.js:132)
at e.handleEvent (Draw.js:524)
at e.handleMapBrowserEvent (PluggableMap.js:933)
at e (events.js:41)
at e.dispatchEvent (Target.js:101)
at e.handlePointerUp_ (MapBrowserEventHandler.js:166)
at e (events.js:41)
和
Uncaught TypeError: Cannot read property 'getGeometry' of null
at e.modifyDrawing_ (Draw.js:717)
at e.handlePointerMove_ (Draw.js:618)
at e.handleEvent (Draw.js:518)
at e.handleMapBrowserEvent (PluggableMap.js:933)
at e (events.js:41)
at e.dispatchEvent (Target.js:101)
at e.relayEvent_ (MapBrowserEventHandler.js:279)
at e (events.js:41)
at e.dispatchEvent (Target.js:101)
at e.fireNativeEvent (PointerEventHandler.js:397)
当我单击开始绘制要素时,第一个错误出现在控制台中。然后蓝点停留在同一个位置,当我四处移动鼠标时,第二个错误反复触发。第一次点击后点击地图将不会执行任何操作。
我在 Draw.js 中看不到任何明显的东西,据我所知,我的代码完全相同,除了一些小的调整以适应我的应用程序,如示例 I如上所述。
我正在使用 OpenLayers 5.3.0,我正在通过 rawgit 加载它:
<link rel="stylesheet" href="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/css/ol.css" type="text/css">
<script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>
我的代码的其他相关部分如下 - 改编自上述示例:
var drawSource = new ol.source.Vector();
var drawVector = new ol.layer.Vector({
source: drawSource,
style: new ol.style.Style({
fill: new ol.style.Fill({
color: 'rgba(255, 255, 255, 0.2)'
}),
stroke: new ol.style.Stroke({
color: '#ffcc33',
width: 2
}),
image: new ol.style.Circle({
radius: 7,
fill: new ol.style.Fill({
color: '#ffcc33'
})
})
})
});
map.addLayer(drawVector);
var modify = new ol.interaction.Modify({source: drawSource});
map.addInteraction(modify);
var draw, snap; // global so we can remove them later
function removeInteractions() {
map.removeInteraction(draw);
map.removeInteraction(snap);
}
function addInteractions() {
draw = new ol.interaction.Draw({
source: drawSource,
type: ol.geom.Polygon
});
map.addInteraction(draw);
snap = new ol.interaction.Snap({source: drawSource});
map.addInteraction(snap);
}
我正在通过超链接调用 addInteractions() 和 removeInteractions()。在我调用 addInteractions() 之前或在我调用 removeInteractions() 之后没有出现错误。
绘制类型应为字符串
draw = new ol.interaction.Draw({
source: drawSource,
type: 'Polygon'
});