Mapbox GL JSのスタイルのレイヤーからフィーチャーを取得するにはどうすればよいですか？

Question

私はJavaScriptの学習者で、Mapbox GLに問題があります。GL JS：Mapbox Studioには、one my layer — "locations"のスタイルがあります。私はそれをタイルセットとして追加しました。この層には2つのGeoJSON点がありますが、GL JSでそれらを得ることはできません。 私は方法querySourceFeatures(sourceID, [parameters])を使用すべきであることが判明しましたが、そのパラメータを正しく記入することに問題があります。私は書いた：

var allFeatures = map.querySourceFeatures('_id-of-my-tyleset_', { 
    'sourceLayer': 'locations' 
}); 

とは動作しません。

さらに興味深いのは、その後、私は方法queryRenderedFeaturesでこの層を使用し、それは大丈夫ですコードで：

map.on('click', function(e) { 
     var features = map.queryRenderedFeatures(e.point, { 
     layers: ['locations'] 
     }); 

     if (!features.length) { 
     return; 
     } 
     var feature = features[0]; 
     flyToPoint(feature); 
     var popup = new mapboxgl.Popup({ 
      offset: [0, -15] 
     }) 
     .setLngLat(feature.geometry.coordinates) 
     .setHTML('<h3>' + feature.properties.name + '</h3>' + '<p>' + 
      feature.properties.description + '</p>') 
     .addTo(map); 
    }); 

私は地図上のレイヤを追加することについて多くを読み、答えは簡単であることを知っています、しかし、私は解決策を実現することはできませんので、助けてください:)

Here isプロジェクトGitHubで。

Answer 1

あなたの問題は、デフォルトでマップボックススタジオで作成されたすべてのマップのように、自動合成を使用するということです。実際にmorganvolter.cj77n1jkq1ale33jw0g9haxc0-2hagaという名前のソースがない場合、compositeというソースがあり、多くのサブレイヤーがあります。

あなたは、このような層のリストを見つけることができます。

map.getSource('composite').vectorLayerIds

あなたはakkermanと呼ばれるベクトル層を持って明らかにする。 （「locations」は、のスタイルレイヤーの名前で、ソースレイヤーではありません）。したがって、クエリは次のようになります。

map.querySourceFeatures('composite', { 
    'sourceLayer': 'akkerman' 
}); 

これは4つの機能を返します。