All actions
Last updated
Was this helpful?
Last updated
Was this helpful?
A set of helpers to forward dispatch actions to a specific instance reducer
Returns an action dispatcher that wraps and forwards the actions to a specific instance
Parameters
Examples
Whether an action is a forward action
Parameters
Unwrap an action
Parameters
Wrap an action into a forward action that only modify the state of a specific kepler.gl instance. kepler.gl reducer will look for signatures in the action to determine whether it needs to be forwarded to a specific instance reducer.
wrapTo can be curried. You can create a curried action wrapper by only supply the id
argument
A forward action looks like this
Parameters
Examples
Kepler.gl action types, can be listened by reducers to perform additional tasks whenever an action is called in kepler.gl
Examples
Actions handled mostly by mapStyle
reducer. They manage the display of base map, such as loading and receiving base map styles, hiding and showing map layers, user input of custom map style url.
Add map style from user input to reducer and set it to current style This action is called when user click confirm after putting in a valid style url in the custom map style dialog. It should not be called from outside kepler.gl without a valid inputStyle
in the mapStyle
reducer. param {void}
Input a custom map style object
Parameters
Callback when a custom map style object is received
Parameters
customMapStyle.error
any
Callback when load map style error
Parameters
error
any
Callback when load map style success
Parameters
Update visibleLayerGroups
to change layer group visibility
Parameters
Change to another map style. The selected style should already been loaded into mapStyle.mapStyles
Parameters
Request map style style object based on style.url.
Parameters
Set 3d building layer group color
Parameters
Main kepler.gl actions, these actions handles loading data and config into kepler.gl reducer. These actions is listened by all subreducers,
Add data to kepler.gl reducer, prepare map with preset configuration if config is passed. Kepler.gl provides a handy set of utils to parse data from different formats to the data
object required in dataset. You rarely need to manually format the data obejct.
Use KeplerGlSchema.getConfigToSave
to generate a json blob of the currents instance config. The config object value will always have higher precedence than the options properties.
Kepler.gl uses dataId
in the config to match with loaded dataset. If you pass a config object, you need to match the info.id
of your dataset to the dataId
in each layer
, filter
and interactionConfig.tooltips.fieldsToShow
Parameters
Examples
Initialize kepler.gl reducer. It is used to pass in mapboxApiAccessToken
to mapStyle
reducer.
Parameters
Pass config to kepler.gl instance, prepare the state with preset configs. Calling KeplerGlSchema.parseSavedConfig
to convert saved config before passing it in is required.
You can call receiveMapConfig
before passing in any data. The reducer will store layer and filter config, waiting for data to come in. When data arrives, you can call addDataToMap
without passing any config, and the reducer will try to match preloaded configs. This behavior is designed to allow asynchronous data loading.
It is also useful when you want to prepare the kepler.gl instance with some preset layer and filter settings. Note Sequence is important, receiveMapConfig
needs to be called before data is loaded. Currently kepler.gl doesn't allow calling receiveMapConfig
after data is loaded. It will reset current configuration first then apply config to it.
Parameters
Examples
Reset all sub-reducers to its initial state. This can be used to clear out all configuration in the reducer.
Actions handled mostly by visState
reducer. They manage how data is processed, filtered and displayed on the map by operates on layers, filters and interaction settings.
Add a new filter
Parameters
Returns {type: ActionTypes.ADD_FILTER, dataId: dataId}
Add a new layer
Parameters
Returns {type: ActionTypes.ADD_LAYER, props: props}
Trigger CPU filter of selected dataset
Parameters
Show larger time filter at bottom for time playback (apply to time filter only)
Parameters
Returns {type: ActionTypes.ENLARGE_FILTER, idx: idx}
Update interactionConfig
Parameters
Returns {type: ActionTypes.INTERACTION_CONFIG_CHANGE, config: config}
Update layer base config: dataId, label, column, isVisible
Parameters
Returns {type: ActionTypes.LAYER_CONFIG_CHANGE, oldLayer: oldLayer, newConfig: newConfig}
Update layer text label
Parameters
value
any new value
Update layer type. Previews layer config will be copied if applicable.
Parameters
Returns {type: ActionTypes.LAYER_TYPE_CHANGE, oldLayer: oldLayer, newType: newType}
Update layer visConfig
Parameters
Returns {type: ActionTypes.LAYER_VIS_CONFIG_CHANGE, oldLayer: oldLayer, newVisConfig: newVisConfig}
Update layer visual channel
Parameters
Returns {type: ActionTypes.LAYER_VISUAL_CHANNEL_CHANGE, oldLayer: oldLayer, newConfig: newConfig, channel: channel}
Trigger file loading dispatch addDataToMap
if succeed, or loadFilesErr
if failed
Parameters
Returns {type: ActionTypes.LOAD_FILES, files: any}
Trigger loading file error
Parameters
error
any
Trigger layer click event with clicked object
Parameters
Returns {type: ActionTypes.LAYER_CLICK, info: info}
Trigger layer hover event with hovered object
Parameters
Returns {type: ActionTypes.LAYER_HOVER, info: info}
Trigger map click event, unselect clicked object
Returns {type: ActionTypes.MAP_CLICK}
Parameters
Returns {type: ActionTypes.MAP_CLICK}
Remove a dataset and all layers, filters, tooltip configs that based on it
Parameters
Returns {type: ActionTypes.REMOVE_DATASET, key: key}
Remove a filter from visState.filters
, once a filter is removed, data will be re-filtered and layer will be updated
Parameters
Returns {type: ActionTypes.REMOVE_FILTER, idx: idx}
Remove a layer
Parameters
Returns {type: ActionTypes.REMOVE_LAYER, idx: idx}
Reorder layer, order is an array of layer indexes, index 0 will be the one at the bottom
Parameters
Examples
Returns {type: ActionTypes.REORDER_LAYER, order: order}
Set the map mode
Parameters
Examples
Update filter property
Parameters
value
any new value
Returns {type: ActionTypes.SET_FILTER, idx: idx, prop: prop, value: value}
Set the property of a filter plot
Parameters
Returns {type: ActionTypes.SET_FILTER_PLOT, idx: any, newProp: any}
Set the property of a filter plot
Parameters
info
Returns {type: ActionTypes.SET_FILTER_PLOT, idx: any, newProp: any}
Display dataset table in a modal
Parameters
Returns {type: ActionTypes.SHOW_DATASET_TABLE, dataId: dataId}
Start and end filter animation
Parameters
Returns {type: ActionTypes.TOGGLE_FILTER_ANIMATION, idx: idx}
Toggle visibility of a layer in a split map
Parameters
Returns {type: ActionTypes.TOGGLE_LAYER_FOR_MAP, mapIndex: any, layerId: any}
Reset animation
Parameters
Returns {type: ActionTypes.UPDATE_ANIMATION_TIME, value: value}
Change filter animation speed
Parameters
Returns {type: ActionTypes.UPDATE_FILTER_ANIMATION_SPEED, idx: idx, speed: speed}
update trip layer animation speed
Parameters
Returns {type: ActionTypes.UPDATE_LAYER_ANIMATION_SPEED, speed: speed}
Update layer blending mode
Parameters
Returns {type: ActionTypes.UPDATE_LAYER_BLENDING, mode: mode}
Add new dataset to visState
, with option to load a map config along with the datasets
Parameters
Returns {type: ActionTypes.UPDATE_VIS_DATA, datasets: datasets, options: options, config: config}
Actions handled mostly by uiState
reducer. They manage UI changes in tha app, such as open and close side panel, switch between tabs in the side panel, open and close modal dialog for exporting data / images etc. It also manges which settings are selected during image and map export
Add a notification to be displayed. Existing notification is going to be updated in case of matching ids.
Parameters
Delete cached export image
Hide side panel header dropdown, activated by clicking the share link on top of the side panel
Toggle active map control panel
Parameters
Remove a notification
Parameters
Whether to including data in map config, toggle between true
or false
Set data format for exporting data
Parameters
Whether to export filtered data, true
or false
Parameters
Set exportImage.setExportImageDataUri
to a dataUri
Parameters
Set exportImage
settings: ratio, resolution, legend
Parameters
Set selected dataset for export
Parameters
Whether we export a mapbox access token used to create a single map html file
Parameters
Hide and show side panel header dropdown, activated by clicking the share link on top of the side panel
Parameters
Set exportImage.exporting
to true
Toggle active map control panel
Parameters
Show and hide modal dialog
Parameters
Toggle active side panel
Parameters
Root actions managers adding and removing instances in root reducer. Under-the-hood, when a KeplerGl
component is mounted or unmounted, it will automatically calls these actions to add itself to the root reducer. However, sometimes the data is ready before the component is registered in the reducer, in this case, you can manually call these actions or the corresponding updater to add it to the reducer.
Delete an instance from keplerGlReducer
. This action is called under-the-hood when a KeplerGl
component is un-mounted to the dom. If mint
is set to be true
in the component prop, the instance state will be deleted from the root reducer. Otherwise, the root reducer will keep the instance state and later transfer it to a newly mounted component with the same id
Updaters:
Parameters
Add a new kepler.gl instance in keplerGlReducer
. This action is called under-the-hood when a KeplerGl
component is mounted to the dom. Note that if you dispatch actions such as adding data to a kepler.gl instance before the React component is mounted, the action will not be performed. Instance reducer can only handle actions when it is instantiated.
Updaters:
Parameters
Rename an instance in the root reducer, keep its entire state
Updaters:
Parameters
Actions handled mostly by mapState
reducer. They manage map viewport update, toggle between 2d and 3d map, toggle between single and split maps.
Fit map viewport to bounds
Parameters
Examples
Toggle between 3d and 2d map.
Examples
Toggle between single map or split maps
Parameters
Examples
Update map viewport
Parameters
Examples
Set the color palette ui for layer color
Parameters
Set the export map format (html, json)
Parameters
id
instance id
dispatch
action dispatcher
action
the action object
Returns boolean - whether the action is a forward action
action
the action object
Returns unwrapped action
id
The id to forward to
action
the action object {type: string, payload: *}
Type:
ActionTypes:
Updaters:
ActionTypes:
Updaters:
inputStyle
inputStyle.url
style url e.g. 'mapbox://styles/heshan/xxxxxyyyyzzz'
inputStyle.id
style url e.g. 'custom_style_1'
inputStyle.style
actual mapbox style json
inputStyle.name
style name
inputStyle.layerGroups
layer groups that can be used to set map layer visibility
inputStyle.icon
icon image data url
mapState
mapState is optional
ActionTypes:
Updaters:
customMapStyle
customMapStyle.icon
customMapStyle.style
ActionTypes:
Updaters:
ActionTypes:
Updaters:
newStyles
a {[id]: style}
mapping
ActionTypes:
Updaters:
mapStyle
new config {visibleLayerGroups: {label: false, road: true, background: true}}
ActionTypes:
Updaters:
styleType
the style to change to
ActionTypes:
Updaters:
mapStyles
<>
ActionTypes:
Updaters:
color
[r, g, b]
ActionTypes:
Updaters:
data
data.datasets
(<> | ) *required datasets can be a dataset or an array of datasets Each dataset object needs to have info
and data
property.
data.datasets.info
-info of a dataset
data.datasets.info.id
id of this dataset. If config is defined, id
should matches the dataId
in config.
data.datasets.info.label
A display name of this dataset
data.datasets.data
*required The data object, in a tabular format with 2 properties fields
and rows
data.datasets.data.fields
<> *required Array of fields,
data.datasets.data.fields.name
*required Name of the field,
data.datasets.data.rows
<> *required Array of rows, in a tabular format with fields
and rows
data.options
data.options.centerMap
default: true
if centerMap
is set to true
kepler.gl will place the map view within the data points boundaries. options.centerMap
will override config.mapState
if passed in.
data.options.readOnly
default: false
if readOnly
is set to true
the left setting panel will be hidden
data.options.keepExistingConfig
whether to keep exiting map data and associated layer filter interaction config default: false
.
data.config
this object will contain the full kepler.gl instance configuration {mapState, mapStyle, visState}
ActionTypes:
Updaters:
payload
payload.mapboxApiAccessToken
mapboxApiAccessToken to be saved to mapStyle reducer
payload.mapboxApiUrl
mapboxApiUrl to be saved to mapStyle reducer.
payload.mapStylesReplaceDefault
mapStylesReplaceDefault to be saved to mapStyle reducer
ActionTypes:
Updaters: , ,
config
*required The Config Object
options
*optional The Option object
options.centerMap
default: true
if centerMap
is set to true
kepler.gl will place the map view within the data points boundaries
options.readOnly
default: false
if readOnly
is set to true
the left setting panel will be hidden
options.keepExistingConfig
whether to keep exiting layer filter and interaction config default: false
.
ActionTypes:
Updaters: , , ,
ActionTypes:
Updaters:
dataId
dataset id
this new filter is associated with
ActionTypes:
Updaters:
props
new layer props
ActionTypes:
Updaters:
dataId
( | Arrary<>) single dataId or an array of dataIds
Returns {type: ActionTypes.APPLY_CPU_FILTER, dataId: }
ActionTypes:
Updaters:
idx
index of filter to enlarge
ActionTypes:
Updaters:
config
new config as key value map: {tooltip: {enabled: true}}
ActionTypes:
Updaters:
oldLayer
layer to be updated
newConfig
new config
ActionTypes:
Updaters:
oldLayer
layer to be updated
idx
-idx
of text label to be updated
prop
prop
of text label, e,g, anchor
, alignment
, color
, size
, field
ActionTypes:
Updaters:
oldLayer
layer to be updated
newType
new type
ActionTypes:
Updaters:
oldLayer
layer to be updated
newVisConfig
new visConfig as a key value map: e.g. {opacity: 0.8}
ActionTypes:
Updaters:
oldLayer
layer to be updated
newConfig
new visual channel config
channel
channel to be updated
ActionTypes:
Updaters: ,
files
<> array of fileblob
ActionTypes:
Updaters: ,
Returns {type: ActionTypes.LOAD_FILES_ERR, error: }
ActionTypes:
Updaters:
info
Object clicked, returned by deck.gl
ActionTypes:
Updaters:
info
Object hovered, returned by deck.gl
ActionTypes:
Updaters:
Trigger map mouse moveevent, payload would be React-map-gl MapLayerMouseEvent
ActionTypes:
Updaters:
evt
MapLayerMouseEvent
ActionTypes:
Updaters:
key
dataset id
ActionTypes:
Updaters:
idx
idx of filter to be removed
ActionTypes:
Updaters:
idx
idx of layer to be removed
ActionTypes:
Updaters:
order
<> an array of layer indexes
ActionTypes:
Updaters:
mode
one of EDITOR_MODES
ActionTypes:
Updaters:
idx
-idx
of filter to be updated
prop
prop
of filter, e,g, dataId
, name
, value
valueIndex
array properties like dataset require index in order to improve performance
ActionTypes:
Updaters:
idx
newProp
key value mapping of new prop {yAxis: 'histogram'}
ActionTypes:
Updaters:
idx
newProp
key value mapping of new prop {yAxis: 'histogram'}
ActionTypes:
Updaters:
dataId
dataset id to show in table
ActionTypes:
Updaters:
idx
idx of filter
ActionTypes:
Updaters:
mapIndex
index of the split map
layerId
id of the layer
ActionTypes:
Updaters:
value
Current value of the slider
ActionTypes:
Updaters:
idx
idx
of filter
speed
speed
to change it to. speed
is a multiplier
ActionTypes:
Updaters:
speed
speed
to change it to. speed
is a multiplier
ActionTypes:
Updaters:
mode
one of additive
, normal
and subtractive
ActionTypes:
Updaters:
datasets
(<> | ) *required datasets can be a dataset or an array of datasets Each dataset object needs to have info
and data
property.
datasets.info
-info of a dataset
datasets.info.id
id of this dataset. If config is defined, id
should matches the dataId
in config.
datasets.info.label
A display name of this dataset
datasets.data
*required The data object, in a tabular format with 2 properties fields
and rows
datasets.data.fields
<> *required Array of fields,
datasets.data.fields.name
*required Name of the field,
datasets.data.rows
<> *required Array of rows, in a tabular format with fields
and rows
options
options.centerMap
default: true
if centerMap
is set to true
kepler.gl will place the map view within the data points boundaries
options.readOnly
default: false
if readOnly
is set to true
the left setting panel will be hidden
config
this object will contain the full kepler.gl instance configuration {mapState, mapStyle, visState}
ActionTypes:
Updaters:
notification
The notification
object to be added
ActionTypes:
Updaters:
ActionTypes:
Updaters:
ActionTypes:
Updaters:
datasetId
id
of the dataset to be deleted
ActionTypes:
Updaters:
id
id
of the notification to be removed
ActionTypes:
Updaters:
ActionTypes:
Updaters:
dataType
one of 'text/csv'
ActionTypes:
Updaters:
payload
set true
to ony export filtered data
ActionTypes:
Updaters:
dataUri
export image data uri
ActionTypes:
Updaters:
newSetting
{ratio: '1x'}
ActionTypes:
Updaters:
datasetId
dataset id
ActionTypes:
Updaters:
payload
mapbox access token
ActionTypes:
Updaters:
id
id of the dropdown
ActionTypes:
Updaters:
ActionTypes:
Updaters:
panelId
map control panel id, one of the keys of:
ActionTypes:
Updaters:
id
( | null) id of modal to be shown, null to hide modals. One of:-
ActionTypes:
Updaters:
id
id of side panel to be shown, one of layer
, filter
, interaction
, map
ActionTypes:
id
the id of the instance to be deleted
ActionTypes:
payload
payload.id
*required The id of the instance
payload.mint
Whether to use a fresh empty state, when mint: true
it will always load a fresh state when the component is re-mounted. When mint: false
it will register with existing instance state under the same id
, when the component is unmounted then mounted again. Default: true
payload.mapboxApiAccessToken
mapboxApiAccessToken to be saved in map-style
reducer.
payload.mapboxApiUrl
mapboxApiUrl to be saved in map-style
reducer.
payload.mapStylesReplaceDefault
mapStylesReplaceDefault to be saved in map-style
reducer.
ActionTypes:
oldId
*required old id
newId
*required new id
ActionTypes:
Updaters:
bounds
<> as [lngMin, latMin, lngMax, latMax]
ActionTypes:
Updaters:
ActionTypes:
Updaters: , ,
index
? index is provided, close split map at index
ActionTypes:
Updaters:
viewport
viewport object container one or any of these properties width
, height
, latitude
longitude
, zoom
, pitch
, bearing
, dragRotate
viewport.width
? Width of viewport
viewport.height
? Height of viewport
viewport.zoom
? Zoom of viewport
viewport.pitch
? Camera angle in degrees (0 is straight down)
viewport.bearing
? Map rotation in degrees (0 means north is up)
viewport.latitude
? Latitude center of viewport on map in mercator projection
viewport.longitude
? Longitude Center of viewport on map in mercator projection
viewport.dragRotate
? Whether to enable drag and rotate map into perspective viewport
ActionTypes:
Updaters:
oldLayer
layer to be updated
prop
which color prop
newConfig
to be merged
ActionTypes:
Updaters:
payload
map format