加载源向量（特征不会显示？）

Question

我有一个函数可以从本地 geojson 文件加载矢量源。

问题是，我需要其中一个层是远程的，但是尽管正确加载了源并且 console.logs 显示它确实获取了它们，但这些功能从未显示出来......还有一个奇怪的如果我从代码中省略行："this.layerSwitcherGroup.getLayers().push(this.pointsLayer);"，就会发生这种情况。当该行被注释时，加载器永远不会运行（没有 console.logs 从里面出现）。

注意：我只是暂时编辑 crs，直到服务器中的文件将 crs 更新为非遗留文件。当我通过下载并编辑 crs 部分来测试具有本地功能的服务器的 geojson 文件时，我做了同样的事情。本地功能有效，但远程功能无效。

addPoints: function() {
    this.addPointInteraction();

    this.pointsLayer = new ol.layer.Vector({
        source: new ol.source.Vector({
            /**
             * The function is responsible for loading the features and adding them to the source.
             * ol.source.Vector sources use a function of this type to load features.
             * @param extent - the area to be loaded
             * @param resolution - the resolution (map units per pixel)
             * @param projection - ol.proj.Projection for the projection as arguments
             *
             *  this (keyword): within the function is bound to the ol.source.Vector it's called from.
             */
            loader: function(extent, resolution, projection) {
                console.log('vector Loader...');

                var url = //can't show the url here;
                $.ajax({
                    url: url,
                    context: this,
                    success: function(json) {
                        console.log('Data: ', json);

                        json.data.crs = {
                            "type": "name",
                            "properties": {
                                "name": "urn:ogc:def:crs:OGC:1.3:CRS84"
                            }
                        };

                        console.log('changed CRS: ', json);

                        var features = new ol.format.GeoJSON().readFeatures(json.data);

                        console.log('this inside loader: ', this);

                        this.addFeatures(features);
                    }
                });
            }
        }),
        style: this.defaultPointStyleFunction
    });

    this.layerSwitcherGroup.getLayers().push(this.pointsLayer);

    this.pointsLayer.getSource().once("change", function(evt) {
        console.log('pointsLayer once');
        //console.log('pointsLayer changed: ', this.pointsLayer);
        //console.log('pointsLayer source: ', this.pointsLayer.getSource());
        console.log('pointsLayer features: ', this.pointsLayer.getSource().getFeatures());
        //console.log('current layerSwitcherGroup layers: ', this.layerSwitcherGroup.getLayers());

        this.hidePoints();
        this.onSetSelection(1);
    }, this);

    this.currPointId = null;
},

上面列出的每个函数都适用于本地模式，所以我不太确定我在使用远程加载程序时做错了什么...

Answer 1

改变这个

var features = new ol.format.GeoJSON().readFeatures(json.data);

至此

var features = (new ol.format.GeoJSON()).readFeatures(json.data);

Answer 2

我已使用此处提供的示例完成此操作：http://openlayersbook.github.io/ch11-creating-web-map-apps/example-03.html

不确定是否有帮助。

Answer 3

所以我所缺少的只是将 {featureProjection: 'EPSG:3857'} 添加到 readFeatures 以便将要素正确投影到地图视图中...（因为那是地图投影）

通过替换

修复了它

var features = new ol.format.GeoJSON().readFeatures(json.data);

有

var features = format.readFeatures(json.data, {featureProjection: 'EPSG:3857'});

通过找到的，现在特征显示在正确的位置！

谢谢大家的建议！

加载源向量（特征不会显示？）

Loading source vector (Features won't show?)

javascript

openlayers-3