[Maps] MapEmbeddable setLayerList (#52573)
* [Maps] MapEmbeddable setLayerList * review feedback
This commit is contained in:
parent
7ba47eebbf
commit
9c203613db
|
@ -79,3 +79,101 @@ const eventHandlers = {
|
||||||
|
|
||||||
const mapEmbeddable = await factory.createFromState(state, input, parent, renderTooltipContent, eventHandlers);
|
const mapEmbeddable = await factory.createFromState(state, input, parent, renderTooltipContent, eventHandlers);
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
|
#### Passing in geospatial data
|
||||||
|
You can pass geospatial data into the Map embeddable by configuring the layerList parameter with a layer with `GEOJSON_FILE` source.
|
||||||
|
Geojson sources will not update unless you modify `__featureCollection` property by calling the `setLayerList` method.
|
||||||
|
|
||||||
|
```
|
||||||
|
const factory = new MapEmbeddableFactory();
|
||||||
|
const state = {
|
||||||
|
layerList: [
|
||||||
|
{
|
||||||
|
'id': 'gaxya',
|
||||||
|
'label': 'My geospatial data',
|
||||||
|
'minZoom': 0,
|
||||||
|
'maxZoom': 24,
|
||||||
|
'alpha': 1,
|
||||||
|
'sourceDescriptor': {
|
||||||
|
'id': 'b7486',
|
||||||
|
'type': 'GEOJSON_FILE',
|
||||||
|
'__featureCollection': {
|
||||||
|
"type": "FeatureCollection",
|
||||||
|
"features": [
|
||||||
|
{
|
||||||
|
"type": "Feature",
|
||||||
|
"geometry": {
|
||||||
|
"type": "Polygon",
|
||||||
|
"coordinates": [
|
||||||
|
[
|
||||||
|
[0, 0], [10, 10], [10, 0], [0, 0]
|
||||||
|
]
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"properties": {
|
||||||
|
"name": "null island",
|
||||||
|
"another_prop": "something else interesting"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'visible': true,
|
||||||
|
'style': {
|
||||||
|
'type': 'VECTOR',
|
||||||
|
'properties': {}
|
||||||
|
},
|
||||||
|
'type': 'VECTOR'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
title: 'my map',
|
||||||
|
}
|
||||||
|
const input = {
|
||||||
|
hideFilterActions: true,
|
||||||
|
isLayerTOCOpen: false,
|
||||||
|
openTOCDetails: ['tfi3f', 'edh66'],
|
||||||
|
mapCenter: { lat: 0.0, lon: 0.0, zoom: 7 }
|
||||||
|
}
|
||||||
|
const mapEmbeddable = await factory.createFromState(state, input, parent);
|
||||||
|
|
||||||
|
mapEmbeddable.setLayerList([
|
||||||
|
{
|
||||||
|
'id': 'gaxya',
|
||||||
|
'label': 'My geospatial data',
|
||||||
|
'minZoom': 0,
|
||||||
|
'maxZoom': 24,
|
||||||
|
'alpha': 1,
|
||||||
|
'sourceDescriptor': {
|
||||||
|
'id': 'b7486',
|
||||||
|
'type': 'GEOJSON_FILE',
|
||||||
|
'__featureCollection': {
|
||||||
|
"type": "FeatureCollection",
|
||||||
|
"features": [
|
||||||
|
{
|
||||||
|
"type": "Feature",
|
||||||
|
"geometry": {
|
||||||
|
"type": "Polygon",
|
||||||
|
"coordinates": [
|
||||||
|
[
|
||||||
|
[35, 35], [45, 45], [45, 35], [35, 35]
|
||||||
|
]
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"properties": {
|
||||||
|
"name": "null island",
|
||||||
|
"another_prop": "something else interesting"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'visible': true,
|
||||||
|
'style': {
|
||||||
|
'type': 'VECTOR',
|
||||||
|
'properties': {}
|
||||||
|
},
|
||||||
|
'type': 'VECTOR'
|
||||||
|
}
|
||||||
|
]);
|
||||||
|
```
|
||||||
|
|
|
@ -165,6 +165,11 @@ export class MapEmbeddable extends Embeddable {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async setLayerList(layerList) {
|
||||||
|
this._layerList = layerList;
|
||||||
|
return await this._store.dispatch(replaceLayerList(this._layerList));
|
||||||
|
}
|
||||||
|
|
||||||
addFilters = filters => {
|
addFilters = filters => {
|
||||||
npStart.plugins.uiActions.executeTriggerActions(APPLY_FILTER_TRIGGER, {
|
npStart.plugins.uiActions.executeTriggerActions(APPLY_FILTER_TRIGGER, {
|
||||||
embeddable: this,
|
embeddable: this,
|
||||||
|
|
Loading…
Reference in a new issue