From 22e38c305288b618af0e19473887eecffd84c3a5 Mon Sep 17 00:00:00 2001 From: CindyvdVries Date: Mon, 12 Aug 2019 11:14:03 +0200 Subject: [PATCH 1/3] adjust to config mapboxlayers --- api-mock/datasets-old.json | 183 ------------------ api-mock/datasets.json | 14 +- store/map/datasets.js | 2 +- .../unit/store/map/datasets/mutations.spec.js | 2 +- 4 files changed, 9 insertions(+), 192 deletions(-) delete mode 100644 api-mock/datasets-old.json diff --git a/api-mock/datasets-old.json b/api-mock/datasets-old.json deleted file mode 100644 index 6b8c7d79..00000000 --- a/api-mock/datasets-old.json +++ /dev/null @@ -1,183 +0,0 @@ -{ - "Coastal management": { - "id": "cm", - "name": "Coastal management", - "datasets": [{ - "dataType": "timeseries", - "description": "To be filled by Daniel", - "id": "sc", - "name": "Shoreline changes", - "timeSpan": "Live", - "units": "m" - }, - { - "dataType": "timeseries", - "description": "To be filled by Daniel", - "id": "fw", - "name": "Bathymetry and topography", - "timeSpan": "Live", - "units": "m" - } - ] - }, - "Flooding": { - "id": "fl", - "name": "Flooding", - "datasets": [{ - "dataType": "timeseries", - "description": "To be filled by Daniel", - "id": "fw", - "name": "Flood warning", - "timeSpan": "Live", - "units": "N/A" - }, - { - "dataType": "timeseries", - "description": "To be filled by Daniel", - "id": "cc", - "name": "Currents", - "timeSpan": "Live", - "units": "km/h", - "wmsUrl": "https://earthengine.googleapis.com/map/1311df60b987b59a9aefc5ee500dd17c/{z}/{x}/{y}?token=d0872d3bfff1dc1d66d504c492cabf78" - }, - { - "dataType": "timeseries", - "description": "To be filled by Daniel", - "id": "wl", - "name": "Waterlevel", - "timeSpan": "Live", - "units": "m", - "dataServiceIds": ["H.simulated"], - "wmsUrl": "https://earthengine.googleapis.com/map/6e041ff999149aa6223f09403f76debb/{z}/{x}/{y}?token=6a1746b0833f2cf979233b41a5f331d0", - "mapboxLayer": { - "id": "vector_wl", - "type": "circle", - "source": { - "type": "vector", - "url": "mapbox://global-data-viewer.6w19mbaw" - }, - "source-layer": "pltc012flat", - "filter": [ - "all", - [ - "==", - ["get", "H.simulated"], - true - ] - ] - } - }, - { - "dataType": "timeseries", - "description": "To be filled by Daniel", - "id": "dd", - "name": "Discharge", - "timeSpan": "Live", - "units": "m3/s" - }, - { - "dataType": "timeseries", - "description": "To be filled by Daniel", - "id": "sh", - "name": "Surge Height", - "timeSpan": "Live", - "units": "m", - "wmsUrl": "http://pl-tc012.xtr.deltares.nl:8080/FewsWebServices/wms?service=WMS&request=GetMap&version=1.3&layers=Surge%20Height&styles=&format=image%2Fpng&transparent=true&crs=EPSG%3A3857&time=2019-04-24T14%3A00%3A00.000Z&uppercase=false&width=256&height=256&bbox={bbox-epsg-3857}" - }, - { - "dataType": "timeseries", - "description": "To be filled by Daniel", - "id": "tt", - "name": "Tide", - "timeSpan": "Live", - "units": "m", - "wmsUrl": "http://pl-tc012.xtr.deltares.nl:8080/FewsWebServices/wms?service=WMS&request=GetMap&version=1.3&layers=Astronomical%20Tide&styles=&format=image%2Fpng&transparent=true&crs=EPSG%3A3857&time=2019-04-24T14%3A00%3A00.000Z&uppercase=false&width=256&height=256&bbox={bbox-epsg-3857}" - }, - { - "dataType": "timeseries", - "description": "To be filled by Daniel", - "id": "wd", - "name": "Wind test", - "timeSpan": "Live", - "units": "m/s", - "dataServiceIds": ["Wind.speed", "Wind.direction"], - "wmsUrl": "https://stamen-tiles.a.ssl.fastly.net/watercolor/{z}/{x}/{y}.jpg", - "mapboxLayer": { - "id": "vector_wd", - "type": "circle", - "source": { - "type": "vector", - "url": "mapbox://global-data-viewer.6w19mbaw" - }, - "source-layer": "pltc012flat", - "filter": [ - "all", - [ - "==", - ["get", "Wind.speed"], - true - ] - ] - } - }, - { - "dataType": "timeseries", - "description": "To be filled by Daniel", - "id": "pp", - "name": "Precipitation", - "dataServiceIds": ["Alert.level"], - "timeSpan": "Live", - "units": "mm/h", - "mapboxLayer": { - "id": "vector_pp", - "type": "circle", - "source": { - "type": "vector", - "url": "mapbox://global-data-viewer.6w19mbaw" - }, - "source-layer": "pltc012flat", - "filter": [ - "all", - [ - "==", - ["get", "H.astronomical.simulated"], - true - ] - ] - } - }, - { - "dataType": "timeseries", - "description": "To be filled by Daniel", - "id": "at", - "name": "Air temperature", - "timeSpan": "Live", - "units": "deg" - } - ] - }, - "Offshore": { - "id": "os", - "name": "Offshore", - "datasets": [{ - "dataType": "timeseries", - "description": "To be filled by Daniel", - "id": "wv", - "name": "Waves", - "timeSpan": "Live", - "units": "m", - "wmsUrl": "http://pl-tc012.xtr.deltares.nl:8080/FewsWebServices/wms?service=WMS&request=GetMap&version=1.3&layers=Significant%20Wave%20Height&styles=&format=image%2Fpng&transparent=true&crs=EPSG%3A3857&time=2019-04-24T14%3A00%3A00.000Z&uppercase=false&width=256&height=256&bbox={bbox-epsg-3857}" - }, - { - "dataType": "timeseries", - "description": "To be filled by Daniel", - "id": "cc", - "name": "Currents", - "timeSpan": "Live", - "dataServiceIds": ["currents"], - "units": "km/h", - "wmsUrl": "http://pl-tc012.xtr.deltares.nl:8080/FewsWebServices/wms?service=WMS&request=GetMap&version=1.3&layers=Current%202DH&styles=&format=image%2Fpng&transparent=true&crs=EPSG%3A3857&time=2019-04-24T14%3A00%3A00.000Z&uppercase=false&width=256&height=256&bbox={bbox-epsg-3857}" - } - ] - } -} diff --git a/api-mock/datasets.json b/api-mock/datasets.json index 12916fcb..b5c8d4a3 100644 --- a/api-mock/datasets.json +++ b/api-mock/datasets.json @@ -15,7 +15,7 @@ "timeSpan": "Live", "units": "N/A", "vectorLayer": { - "mapboxLayer": [{ + "mapboxLayers": [{ "filterIds": [ "Alert.level" ], @@ -61,7 +61,7 @@ "timeSpan": "Live", "units": "m", "vectorLayer": { - "mapboxLayer": [{ + "mapboxLayers": [{ "filterIds": [ "H.simulated" ], @@ -91,7 +91,7 @@ "timeSpan": "Live", "units": "m", "vectorLayer": { - "mapboxLayer": [{ + "mapboxLayers": [{ "filterIds": [ "H.surge.simulated" ], @@ -121,7 +121,7 @@ "timeSpan": "Live", "units": "m", "vectorLayer": { - "mapboxLayer": [{ + "mapboxLayers": [{ "filterIds": [ "H.astronomical.simulated" ], @@ -150,7 +150,7 @@ "timeSpan": "Live", "units": "m/s", "vectorLayer": { - "mapboxLayer": [{ + "mapboxLayers": [{ "filterIds": [ "Wind.speed", "Wind.direction" @@ -181,7 +181,7 @@ "timeSpan": "Live", "units": "m", "vectorLayer": { - "mapboxLayer": [{ + "mapboxLayers": [{ "filterIds": [ "H.simulated" ], @@ -205,7 +205,7 @@ "timeSpan": "Historic", "units": "m", "vectorLayer": { - "mapboxLayer": [ + "mapboxLayers": [ { "id": "shoreline-aggregatedpointsz0", "type": "circle", diff --git a/store/map/datasets.js b/store/map/datasets.js index 3a51b483..80004ac5 100644 --- a/store/map/datasets.js +++ b/store/map/datasets.js @@ -30,7 +30,7 @@ export const mutations = { // TODO: make generic by looping over vectorLayer const mergedVector = _.merge( - { mapboxLayer: _.get(data, 'vectorLayer.mapboxLayer') }, + { mapboxLayer: _.get(data, 'vectorLayer.mapboxLayers') }, vectorData, ) Vue.set(state[id], 'vector', mergedVector) diff --git a/test/unit/store/map/datasets/mutations.spec.js b/test/unit/store/map/datasets/mutations.spec.js index 168459e2..bfd82440 100644 --- a/test/unit/store/map/datasets/mutations.spec.js +++ b/test/unit/store/map/datasets/mutations.spec.js @@ -3,7 +3,7 @@ import { mutations } from '../../../../../store/map/datasets' describe('addDatasetVector', () => { test('updates state with payload', () => { const state = { wl: { metadata: 'foo' } } - const data = { id: 'wl', vectorLayer: { mapboxLayer: 'bar' } } + const data = { id: 'wl', vectorLayer: { mapboxLayers: 'bar' } } mutations.addDatasetVector(state, data) expect(state).toMatchObject({ From 6cb1e37d1623069810eab7cbc9d154bcfdaa22e0 Mon Sep 17 00:00:00 2001 From: CindyvdVries Date: Mon, 12 Aug 2019 11:17:43 +0200 Subject: [PATCH 2/3] lint and test --- test/unit/store/map/datasets/mutations.spec.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/unit/store/map/datasets/mutations.spec.js b/test/unit/store/map/datasets/mutations.spec.js index bfd82440..a13692c0 100644 --- a/test/unit/store/map/datasets/mutations.spec.js +++ b/test/unit/store/map/datasets/mutations.spec.js @@ -71,7 +71,7 @@ describe('addDatasetVector', () => { }, } - const data = { id: 'wd', vectorLayer: { mapboxLayer: { bar: 'foo' } } } + const data = { id: 'wd', vectorLayer: { mapboxLayers: { bar: 'foo' } } } mutations.addDatasetVector(state, data) expect(state).toMatchObject({ From 1d452e8d3be94bc8fda508feafbdc4ba7510f1b3 Mon Sep 17 00:00:00 2001 From: CindyvdVries Date: Mon, 12 Aug 2019 11:27:16 +0200 Subject: [PATCH 3/3] Update v-mapbox-vector-layer.vue --- .../v-mapbox-vector-layer.vue | 21 +++++++++++-------- 1 file changed, 12 insertions(+), 9 deletions(-) diff --git a/components/v-mapbox-components/v-mapbox-vector-layer.vue b/components/v-mapbox-components/v-mapbox-vector-layer.vue index a878aebf..73c47ab9 100644 --- a/components/v-mapbox-components/v-mapbox-vector-layer.vue +++ b/components/v-mapbox-components/v-mapbox-vector-layer.vue @@ -26,13 +26,7 @@ export default { watch: { layers: { handler(newValue) { - newValue.forEach((newLayer, index) => { - if (this.map.getLayer(this.layers[index].id)) { - this.map.setFilter(this.layers[index].id, newLayer.filter) - } else { - this.addToMap() - } - }) + this.updateMap() }, deep: true, }, @@ -43,7 +37,7 @@ export default { created() { this.map = this.getMap() if (this.map.loaded()) { - this.addToMap() + this.updateMap() } }, beforeDestroy() { @@ -56,7 +50,16 @@ export default { }, methods: { deferredMountedTo(map) { - this.addToMap() + this.updateMap() + }, + updateMap() { + this.layers.forEach((newLayer, index) => { + if (this.map.getLayer(this.layers[index].id)) { + this.map.setFilter(this.layers[index].id, newLayer.filter) + } else { + this.addToMap() + } + }) }, addToMap() { this.layers.forEach(layer => {