Question

我想在我的Typescript应用程序中使用ol-ext（https://github.com/Viglino/ol-ext）中的AnimatedCluster模块。我已经为其创建了一个类型模块，并将其导入到我的组件类中。代码会生成，但是当我尝试将AnimatedCluster图层添加到地图中时出现运行时错误。

这是我在运行时遇到的错误：

vendor.js?v=4SAa8LuhjenIVeZBpu4Xc7BJBZJ1PGb7_mdlreEEFl8:1744 
ERROR TypeError: a.dg is not a function
    at vendor.js?v=4SAa8LuhjenIVeZBpu4Xc7BJBZJ1PGb7_mdlreEEFl8:186538
    at B.k.forEach (vendor.js?v=4SAa8LuhjenIVeZBpu4Xc7BJBZJ1PGb7_mdlreEEFl8:186470)
    at mg.k.dg (vendor.js?v=4SAa8LuhjenIVeZBpu4Xc7BJBZJ1PGb7_mdlreEEFl8:186538)
    at K.k.pq (vendor.js?v=4SAa8LuhjenIVeZBpu4Xc7BJBZJ1PGb7_mdlreEEFl8:186552)
    at K.<anonymous> (vendor.js?v=4SAa8LuhjenIVeZBpu4Xc7BJBZJ1PGb7_mdlreEEFl8:186538)
    at ZoneDelegate.invokeTask (vendor.js?v=4SAa8LuhjenIVeZBpu4Xc7BJBZJ1PGb7_mdlreEEFl8:189060)
    at Object.onInvokeTask (vendor.js?v=4SAa8LuhjenIVeZBpu4Xc7BJBZJ1PGb7_mdlreEEFl8:5046)
    at ZoneDelegate.invokeTask (vendor.js?v=4SAa8LuhjenIVeZBpu4Xc7BJBZJ1PGb7_mdlreEEFl8:189059)
    at Zone.runTask (vendor.js?v=4SAa8LuhjenIVeZBpu4Xc7BJBZJ1PGb7_mdlreEEFl8:188827)
    at ZoneTask.invokeTask (vendor.js?v=4SAa8LuhjenIVeZBpu4Xc7BJBZJ1PGb7_mdlreEEFl8:189134)

这是我的类型模块的外观（\ src \ MyApp \ animated-clusters.d.ts）：

declare module 'ol-ext/layer/AnimatedCluster';

这是将模块导入到地图组件中的方法：

import * as ol from 'openlayers';
import AnimatedCluster from 'ol-ext/layer/AnimatedCluster';

以下是创建地图并向其中添加AnimatedCluster图层的代码：

// create view
this.olView = new ol.View({
    center: [0, 0],
    zoom: 2,
    minZoom: 6.5,
    maxZoom: 20,
    extent: this.olExtent
});

// create map
this.olMap = new ol.Map({
    controls: [],
    target: this.element.nativeElement.firstElementChild,
    view: this.olView
});

// create layer
let source = new ol.source.TileArcGISRest({
                    url: 'http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer'
});

this.baseMapLayer = new ol.layer.Tile();
this.olMap.addLayer(this.baseMapLayer);

this.baseMapLayer.setSource(source);

// Cluster Source
let clusterSource = new ol.source.Cluster({
        distance: 40,
        source: new ol.source.Vector()
});

// Animated cluster layer - USING DEFAULT STYLE
let clusterLayer = new AnimatedCluster(
   {
      name: 'Cluster',
      source: clusterSource,
      animationDuration: 0,
      visible: true
    });

// **** THIS IS WHERE THE ERROR OCCURS
this.olMap.addLayer(clusterLayer);

// add 2000 features
let nb = 2000;
let ext = map.getView().calculateExtent(map.getSize());
let features = [];
 for (let i = 0; i < nb; ++i) {
    features[i] = new ol.Feature(new ol.geom.Point([ext[0] + (ext[2] - ext[0]) * Math.random(), ext[1] + (ext[3] - ext[1]) * Math.random()]));
    features[i].set('id', i);
}

clusterSource.getSource().addFeatures(features);

我已经通过stackoverflow，gis.stackexchange和互联网的其余部分进行了投入，但是我找不到我所缺少/做错的事情。任何输入将不胜感激。

在Typescript应用程序中使用ol-ext / AnimatedCluster时出现运行时错误

0 个答案: