CODEWITHSUNDEEP
javascriptmapboxmapbox-gl-jsmapbox-gl
Brian Weinreich
Brian Weinreich

Reputation: 7712

Is it possible to filter buildings layer by the poi_label?

I'd like to do show 3d buildings (fill-extrusion) only for certain buildings.

Is it possible to filter the list of buildings based on the name (from poi_label) of the building?

For example:

map.addLayer({
  'id': 'mybuildinglayer',
  'type': 'fill-extrusion',
  'source': {
     type: 'vector',
     url: 'mapbox://mapbox.mapbox-streets-v7'
  },
  'source-layer': 'building',
  'filter': [
      "==",
      "name",
      "McDonalds"
   ],
   'paint': {
      'fill-extrusion-color': '#FFFFFF',
      'fill-extrusion-height': 50,
      'fill-extrusion-base': 0,
   }
});

Upvotes: 1

Views: 552

Answers (1)

stdob--
stdob--

Reputation: 29157

You need to filter features by name, and find those buildings that contain these features (using turf.js):

// All features rendered:
var fs = map.queryRenderedFeatures();

// Filtering features by source and by name:
var names = ['McDonald\'s Langstrasse'];
var ps = fs.filter(f => 
  f.sourceLayer === 'poi_label' && 
  names.indexOf(f.properties.name) !== -1
);

// Filter the buildings by source and by the entry of feature inside the building:
var bs = fs.filter(f =>
  f.sourceLayer === 'building' &&
  ps.filter(p =>          
    turf.pointsWithinPolygon(turf.points([p.geometry.coordinates]), f.geometry)
        .features.length > 0
  ).length > 0
);

[ https://jsfiddle.net/nq28kc4j/ ]

Upvotes: 2

Related Questions