Deck.gl: Transitions no longer work with Deck 8

[cosullivan]

Description

I have upgraded from version 7.3.8 to version 8.0.1 and the transitions no longer work when changing the view state.

I am setting the transition properties on the viewState as per the following;

viewState={{
    latitude: view.position.latitude,
    longitude: view.position.longitude,
    zoom: view.camera.zoom,
    pitch: view.camera.pitch,
    bearing: view.camera.bearing,
    transitionInterpolator: new FlyToInterpolator(),
    transitionDuration: 2000,
}}

And I have also set

controller={true} 

There is nothing in the upgrade guide about changes to transitions. Have there been changes here that haven't been included in the upgrade doco?

Environment (please complete the following information):

• Framework Version: deck.gl 8.0.1
• Browser Version: Chrome 79.0.3945.88
• OS: Windows 10

[Pessimistress]

If you are using the standalone bundle, we made a change to align it with the rest of the API (pure JS/React). Unless you are listening to onViewStateChange yourself, you should specify initialViewState instead of viewState.

This is indeed missing from the upgrade guide section about the standalone bundle: https://github.com/uber/deck.gl/blob/8.0-release/docs/upgrade-guide.md#standalone-bundle I’ll update it.

[cosullivan]

Hi,

I am using React not the standalone build and it's not working.

I have created a sample here;
https://codesandbox.io/s/sleepy-lamport-yhx09

If you click between the different markers then the lat/lon numbers update right away. If you switch this sample to using version 7.3.8 then you will see that the transition is taking place.

Thanks,
Cain.

[Pessimistress]

Ah interesting. This is a side effect of a bug fix we made in v8, but we did not expect anyone to be using the old "wrong" behavior like you did.

There are two patterns of controlling view state: state-less (viewState + onViewStateChange) or stateful (initialViewState). In short, initialViewState and viewState are never supposed to be provided at the same time.

According to design and documentation (even before v8), if viewState is provided, deck defers to the user to update the view state when appropriate. Part of the bug that got fixed was that it sometimes still tracked the view state internally regardless. If you remove the initialViewState prop from your code sample, you'll see that it stops working for v7.

The "right way" to write your app is to listen to onViewStateChange:

const [state, dispatch] = useMapView();

return (
  <DeckGL
    viewState={state}
    onViewStateChange={({viewState}) => dispatch({
      type: ActionType.SET_VIEWSTATE,
      viewState
    })}
    controller={true}
  />
);

I think there are a few things we can do to make this easier:

• [x] Address this use case in upgrade guide
• [x] Log a warning if both initialViewState and viewState are present
• [ ] Add/upgrade examples to use React hooks?

[cosullivan]

Thanks @Pessimistress , that works now.