2016-05-21 3 views
0

私はOLを初めて利用しています。オープンレイヤー3レイヤーのベストプラクティスをクリック

特定のレイヤーで特定のアイテムを押した場合に発生するロジックを実装する必要があります。

私は最初からプロジェクトを書いているわけではないと言わなければならず、実際には非常に基本的だが複雑なシステムを継承しています。

システムは、MapGuide 2.5からレイヤーを取得します。

これは、マップが開始される方法です。

var map = new ol.Map({ 
      loadTilesWhileInteracting:true, 
      layers: this.layers, 
      target: this._element[0], 
      controls: controls, 
      interactions: interactions, 
      view: view 
     }); 

view.fit(that.extent, map.getSize()); 

は、私が選択インタラクションを追加しようとした - それは動作しませんでした(私の約束が呼び出されませんでした)。

var select_interaction = new ol.interaction.Select(); 

select_interaction.getFeatures().on("add", function (e) { 
    var feature = e.element; //the feature selected 
}); 

map.addInteraction(select_interaction); 

私が試した:この場合

map.on('click', function (evt) { 
      var feature = map.forEachFeatureAtPixel(evt.pixel, 
       function (feature, layer) { 
        debugger; 
        this.log("fff") 
       }); 
     }); 

を、約束は動作しますが、私は何の機能を得るません。

編集:私も試した

var feature = map.forEachLayerAtPixel(evt.pixel, 
       function (feature, layer) {..} 

が、私は例外を取得:

uncaught security error: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data. ol.js:341 

私はこれをどのように行うことができますか?

おかげで、 イド

+0

あなたが実際に任意のベクトルレイヤーをロードしますか? – kagelos

+0

私は知っていない、層は、マップガイドに応じてselctableです。どうすればわかりますか? –

+1

OLでは、レイヤの種類が大きく2つのカテゴリに分かれています。画像レイヤー(タイルなど)とベクターレイヤー。マップのコンストラクタで引数として渡すthis.layersの内容を調べ、それに含まれるレイヤのタイプを確認する必要があります。あなたはベクトル型のレイヤーとだけ対話できます。 – kagelos

答えて

0

私はforEachLayerAtPixelメソッドを介して画素に層をループしようとしたとき、私は同じエラーを得ていました。

@kagelosのコメントのおかげで、私はレイヤーをフィルタリングし、ループするだけで問題を解決することができましたベクターレイヤー。

OLでは、レイヤの種類が大きく2つのカテゴリに分かれています。画像レイヤー(タイルなど)とベクターレイヤー。マップのコンストラクタで引数として渡すthis.layersの内容を調べ、それに含まれるレイヤのタイプを確認する必要があります。ベクタータイプのレイヤーとのみ直接対話できます。ここで

最終的なコードです:

Map.forEachLayerAtPixel(cursorPosition, function (_layer) { 

    // you will get the vector layer here 

}, this, function (_layer) { 

    if (_layer instanceof ol.layer.Vector) { 
     return true; 
    } 
}); 
関連する問題