queryRenderedFeatures returning incorrect fill-extrusion-base and fill-extrusion-height
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 12.4k
- Forks
- 2.4k
- PR merge metrics
- No merged PRs in 30d
Description
**mapbox-gl-js version**: 1.9.1
**browser**: Chrome
### Steps to Trigger Behavior
I'm using fill extrusion layers with LineString geometries to color the sides of buildings. Before #9282, the `queryRenderedFeatures` would return objects with a `layer.paint` containing style expressions that I could evaluate to determine the base and height for each feature.
After #9282, these are evaluated to the incorrect values.
```
> const features = map.queryRenderedFeatures(point);
> features.length
11
> console.log(features[0])
```
```json
{
"geometry": {
"type": "LineString",
"coordinates": [
[ -113.79264436662197, 40.828627564726645 ],
[ -113.7926483899355, 40.82872346056524 ]
]
},
"type": "Feature",
"properties": {
"out:Bldg-ID": "6ed979b6-8d2a-4ce0-9a70-a425c3696388",
"my-metric": 65.760886,
"min_height": 122.5,
"height": 136
},
"layer": {
"id": "my-source-extrusion",
"type": "fill-extrusion",
"source": "my-source",
"layout": {
"visibility": null
},
"paint": {
"fill-extrusion-base": 0,
"fill-extrusion-height": 11,
"fill-extrusion-color": {
"r": 0.351652772012709,
"g": -0.05106863724142475,
"b": 0.8435576652191649,
"a": 1
},
"fill-extrusion-opacity": 1,
"fill-extrusion-vertical-gradient": false
}
},
"source": "my-source",
"state": {}
}
```
This is what the style for that layer looks like:
```json
{
"fillExtrusionPaint": {
"fill-extrusion-base": [ "get", "min_height" ],
"fill-extrusion-height": [ "get", "height" ],
"fill-extrusion-color": [
"case",
[ "has", "building_id" ],
"white",
[
"==",
[ "get", "my-metric" ],
0
],
"yellow",
[
"interpolate-hcl",
[ "linear" ],
[ "get", "my-metric" ],
0,
"blue",
100,
"red"
]
],
"fill-extrusion-opacity": 1,
"fill-extrusion-vertical-gradient": false
}
}
```
The `fill-extrusion-base` and `fill-extrusion-height` properties should evaluate to 122.5 and 136, not 0 and 11.
### Link to Demonstration
I can try to put together a smaller repro if it's helpful.
### Expected Behavior
### Actual Behavior
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reproducing queryRenderedFeatures with a fill-extrusion layer using the reported get expressions and feature properties, comparing results before and after #9282. Trace the evaluation path for fill-extrusion-base and fill-extrusion-height; done means the returned paint values are 122.5 and 136 for the example feature.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, typescript
- Domain
- computer-graphics, frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100