Deck.gl: Walls of extruded polygons are transparent

[SymbolixAU]

Description

Walls of extruded polygons are transparent when specifying a transition duration greater than zero, but without actually using the transition.

A live version showing this issue is hosted here where you can access the console logs.

Here is a screenshot of what's happening.

In the console, for each map I am logging

• Object : the transition object
• l : the PolygonLayer object

The map on the left has transitions: { getElevation: 0 }
The map on the right has transitions: { getElevation: 600 }

Therefore I am setting the transition prop, but not actually using it in either of the maps.

This has only been happening since v7.0.0-beta. Previous versions have worked as intended

The data is the same in both maps - widget_melbourne.json - a geojson file of polygons in Melbourne

Environment

• Framework: deck.gl 7.0.0-beta.1 (https://unpkg.com/[email protected]/dist.min.js)
• Browser: Chrome version 73.0.3683.86 (Official Build) (64-bit)
• Mac OS X 10.14.1 (Mojave)

[1chandu]

@SymbolixAU , what layers are you using, is this specific to one layer? Can you reproduce this with any of the standalone examples provided in the repo, if so it will be easy for us to reproduce and debug.

[dcooley]

@1chandu (I'm on my other github account)

Here's a codepen which demonstrates the issue.

deckgl.min.js version: using https://unpkg.com/[email protected]/dist.min.js

Here's the JS code

/** Data **/
const data = [
  {
      // Simple polygon (array of coords)
      contour: [[-122.4, 37.75], [-122.4, 37.8], [-122.5, 37.8], [-122.5, 37.75], [-122.4, 37.75]],
      elevation: 3000
  }
];

/** DeckGL **/
new deck.DeckGL({
  container: 'container',
  mapboxApiAccessToken: 'pk.eyJ1IjoidWJlcmRhdGEiLCJhIjoidGllX1gxUSJ9.gElUooDF7u51guCQREmAhg',
  mapStyle: 'mapbox://styles/mapbox/dark-v9',

  // mapbox: false, /* disable map */
  longitude: -122.45,
  latitude: 37.8,
  zoom: 11,
  pitch: 30,
  layers: [
    new deck.PolygonLayer({
    id: 'polygon-layer',
    data,
    pickable: true,
    stroked: true,
    filled: true,
    wireframe: true,
    extruded: true,
    lineWidthMinPixels: 1,
    getPolygon: d => d.contour,
    getElevation: d => d.elevation,
    getFillColor: [255,0,0],
    getLineColor: [80, 80, 80],
    getLineWidth: 1,
    transitions: { getElevation: 600 }
  })
  ]
});

And a screenshot

---

Update

I've just tried this on a non-WebGL2 enabled browser and here I see

[Pessimistress]

An attribute transition bug was fixed in beta.4 - give it a try?

Edit: tried rc.1 - issue is still present. I'll investigate.

[Pessimistress]

@SymbolixAU This is fixed in 7.0.3.

[dcooley]

@Pessimistress yes it appears so; I'll be testing this on other layers too and will let you know if there are any other issues

[Pessimistress]

Closing for now, reopen if there're further issues with this