Map Viewport doesn't always update according to ViewState

Hey there,

Description

There seems to be a problem with the OrthographicView viewport not always reflecting the viewState prop when my map loads.

Essentially, I am trying to dynamically control the viewState to constrain my view to a bounding box. A simplified version of my code is the following:

const Map = ({maxBounds}) => {
    const [viewState, setViewState] = useState(null)
    const [isMapLoaded, setIsMapLoaded] = useState(false)

   useEffect(() => {
    if (isMapLoaded) {
        const {minZoom, target} = calculateInitialViewState(maxBounds)
       setViewState(vs => ({...vs, zoom: minZoom, minZoom, target}))
    }
  }, [isMapLoaded, maxBounds] )

  const onViewStateChange = ({viewState: vs}) => {
    const {target, zoom} = calculateBoundedViewState(vs, maxBounds)
    setViewState({ ...vs, target, zoom })
  }

  return (
    <DeckGL
        onLoad={() => setIsMapLoaded(true)}
        viewState={viewState}
        onViewStateChange={onViewStateChange}
       views={new OrthographicView()}
       controller={true}
    >
        {layers}
    </DeckGL>
  )
}

The problem occurs about 20% of the times I reload the page. I’ll console.log what the current viewState is, and about 20% of the time, the viewport does not reflect that. It seems like the times it doesn’t work, the viewManager has a an {} as it’s viewState, and therefore what i see is a viewport centered at target: [0,0] and zoom: 0.

It looks to me like a lot of changes were made with viewState / initialViewState around version 8.1 that still don’t seem to be super clearly documented. Did something change that might be causing this bug?

I noticed a similar issue (https://github.com/visgl/deck.gl/issues/4489#issue-599475498), but since it is closed I figured I would open a new one.

Thanks!

Environment

Framework Version: [e.g. deck.gl 8.2.0-alpha.1] Browser Version: [e.g. Chrome 81.0] OS: [e.g. Mac OS X 10.14]

[Pessimistress]

This will be fixed in 8.5.0. You can try it right now with 8.5.0-alpha.1.

[lukaszbarkowski]

@Pessimistress It looks like it is passed to <DeckGL> correctly, but for some reason the original transition to default state doesn’t stop. I don’t specify transitionInterruption so I guess it should stop the actual one and start the new one ?

Updated demo with console.logs