map-state.md

Table of Contents

• mapStateUpdaters
  • fitBoundsUpdater
  • INITIAL_MAP_STATE
  • receiveMapConfigUpdater
  • togglePerspectiveUpdater
  • toggleSplitMapUpdater
  • updateMapUpdater

mapStateUpdaters

Updaters for mapState reducer. Can be used in your root reducer to directly modify kepler.gl's state. Read more about Using updaters

Examples

import keplerGlReducer, {mapStateUpdaters} from 'kepler.gl/reducers';
// Root Reducer
const reducers = combineReducers({
 keplerGl: keplerGlReducer,
 app: appReducer
});

const composedReducer = (state, action) => {
 switch (action.type) {
   // click button to close side panel
   case 'CLICK_BUTTON':
     return {
       ...state,
       keplerGl: {
         ...state.keplerGl,
         foo: {
            ...state.keplerGl.foo,
            mapState: mapStateUpdaters.fitBoundsUpdater(
              mapState, {payload: [127.34, 31.09, 127.56, 31.59]]}
            )
         }
       }
     };
 }
 return reducers(state, action);
};

export default composedReducer;

fitBoundsUpdater

Fit map viewport to bounds

• Action: fitBounds

Parameters

• state Object
• action Object
  • action.payload Array<number> bounds as [lngMin, latMin, lngMax, latMax]

Returns Object nextState

INITIAL_MAP_STATE

Default initial mapState

Properties

• pitch number Default: 0
• bearing number Default: 0
• latitude number Default: 37.75043
• longitude number Default: -122.34679
• zoom number Default: 9
• dragRotate boolean Default: false
• width number Default: 800
• height number Default: 800
• isSplit boolean Default: false

receiveMapConfigUpdater

Update mapState to propagate a new config

• Action: receiveMapConfig

Parameters

• state Object
• action Object
  • action.payload Object saved map config

Returns Object nextState

togglePerspectiveUpdater

Toggle between 3d and 2d map.

• Action: togglePerspective

Parameters

• state Object

Returns Object nextState

toggleSplitMapUpdater

Toggle between one or split maps

• Action: toggleSplitMap

Parameters

• state Object

Returns Object nextState

updateMapUpdater

Update map viewport

• Action: updateMap

Parameters

• state Object
• action Object
  • action.payload Object viewport

Returns Object nextState