diff --git a/public/static/data/TimeserieParameters.json b/public/static/data/TimeserieParameters.json index 71f0595..187b6f4 100644 --- a/public/static/data/TimeserieParameters.json +++ b/public/static/data/TimeserieParameters.json @@ -1,18 +1,18 @@ [ { - "value": "U10mag", + "value": "U_10_mag", "label": "Hourly-averaged horizontal wind speed at 10 m height U_{10,mag} (m/s)" }, { - "value": "U60mag", + "value": "U_60_mag", "label": "Hourly-averaged horizontal wind speed at 60 m height U_{60,mag} (m/s)" }, { - "value": "U100mag", + "value": "U_100_mag", "label": "Hourly-averaged horizontal wind speed at 100 m height U_{100,mag} (m/s)" }, { - "value": "U120mag", + "value": "U_120_mag", "label": "Hourly-averaged horizontal wind speed at 120 m height U_{120,mag} (m/s)" }, { diff --git a/src/components/MapComponent.vue b/src/components/MapComponent.vue index ec2c9d3..81841a6 100644 --- a/src/components/MapComponent.vue +++ b/src/components/MapComponent.vue @@ -345,7 +345,7 @@ export default { if (locId) { locationIds.push(locId) // locationIds.push(feature.properties[locId]) - feature.properties.zarrIndex = 1 + feature.properties.zarrIndex = feature.properties.id } // write location index for zarr file to state diff --git a/src/store/map/index.js b/src/store/map/index.js index 10ac487..e34c268 100644 --- a/src/store/map/index.js +++ b/src/store/map/index.js @@ -273,7 +273,8 @@ export const actions = { const datasetId = state.activeVectorDataIds const locationId = state.activeLocationIds // const slice = [null, -1] - const url = 'https://storage.googleapis.com/dgds-data-public/metocean/time_series/point_00001.zarr' + const paddedLocationId = state.activeLocationIndex.padStart(5, '0') + const url = `https://storage.googleapis.com/dgds-data-public/metocean/time_series/point_${paddedLocationId}.zarr` const path = parameter return openArray({ @@ -291,7 +292,7 @@ export const actions = { return res.get().then(data => { var arrayData = Array.from(data.data); - console.log(arrayData) + // Filter out NaN values var filteredData = arrayData.filter(value => !isNaN(value)) @@ -335,8 +336,6 @@ export const actions = { timeFormat: "{yyyy}" } } - - console.log(pointData) commit('addDatasetPointData', pointData) diff --git a/src/views/data/datasetIds/LocationId.vue b/src/views/data/datasetIds/LocationId.vue index 154194c..0110a5f 100644 --- a/src/views/data/datasetIds/LocationId.vue +++ b/src/views/data/datasetIds/LocationId.vue @@ -151,171 +151,47 @@ import { export default { components: { GraphLine, TimeSeries, RosePlot, ExtremeValues, WeatherWindow, JointOccurence }, - computed: { - ...mapGetters(['colors', 'user']), - }, - setup() { - const { proxy } = getCurrentInstance() - const store = useStore() - - const option = ref({ - title: { - text: 'Traffic Sources', - left: 'center' - }, - tooltip: { - trigger: 'item', - formatter: '{a}
{b} : {c} ({d}%)' - }, - legend: { - orient: 'vertical', - left: 'left', - data: ['Direct', 'Email', 'Ad Networks', 'Video Ads', 'Search Engines'] - }, - series: [ - { - name: 'Traffic Sources', - type: 'pie', - radius: '55%', - center: ['50%', '60%'], - data: [ - { value: 335, name: 'Direct' }, - { value: 310, name: 'Email' }, - { value: 234, name: 'Ad Networks' }, - { value: 135, name: 'Video Ads' }, - { value: 1548, name: 'Search Engines' } - ], - emphasis: { - itemStyle: { - shadowBlur: 10, - shadowOffsetX: 0, - shadowColor: 'rgba(0, 0, 0, 0.5)' - } - } - } - ], - backgroundColor: 'transparent' - }) - - const expandedDatasets = ref([]) - const activePointDataPerDataset = computed( - () => store.getters.activePointDataPerDataset - ) - const getActiveRasterLayer = computed( - () => store.getters.getActiveRasterLayer - ) - const activeRasterData = computed(() => store.getters.activeRasterData) - const activeSummary = computed(() => store.getters.activeSummary) - - const datasets = computed(() => { - const activePointData = activePointDataPerDataset.value + computed: { + ...mapGetters(['colors', 'user', 'activePointDataPerDataset', 'getActiveRasterLayer', 'activeRasterData', 'activeSummary']), + datasets() { + const activePointData = this.activePointDataPerDataset; const result = Object.keys(activePointData).map((pointId) => _.get(activePointData, [pointId][0]) - ) - return flatten(result) - }) - - const hasSerieData = computed(() => { - if (_.get(datasets.value, '[0].type') === 'images') { - return _.get(datasets.value, '[0].imageUrl') - } else { - return ( - _.get(datasets.value, '[0].serie') && - _.get(datasets.value, '[0].serie').length > 0 - ) - } - }) - - const locations = computed(() => proxy.$route.params.locationId) - const getTimeStep = computed(() => { - const date = _.get(activeRasterData.value, 'date') - if (date) { - return date - } else { - return '' - } - }) - - const activeSummaryId = computed(() => { - let summary = '' - if (activeSummary.value.length === 2) { - summary = - activeSummary.value[0].chosenValue + - '_' + - activeSummary.value[1].chosenValue + ); + return flatten(result); + }, + hasSerieData() { + if (_.get(this.datasets, '[0].type') === 'images') { + return _.get(this.datasets, '[0].imageUrl'); } else { - summary = activeSummary.value.length - } - return summary - }) - - watch( - () => proxy.$route.params.locationId, - () => { - updateLocationPanel() - } - ) - - watch( - () => proxy.$route.params.datasetIds, - () => { - updateLocationPanel() + return _.get(this.datasets, '[0].serie') && _.get(this.datasets, '[0].serie').length > 0; } - ) - - watch(activePointDataPerDataset, () => { - expandedDatasets.value = [] - }) - - watch(activeSummary, { - handler() { - updateLocationPanel() - }, - deep: true - }) - - onMounted(() => { - setTimeout(updateLocationPanel, 3000) - expandedDatasets.value = [...Array(datasets.value.length).keys()] - }) - - onUnmounted(() => { - clearActiveLocationIds() - }) - - const { - loadPointDataForLocation, - clearActiveLocationIds, - setActiveLocationIds - } = mapMutations(['clearActiveLocationIds', 'setActiveLocationIds']) - - const updateLocationPanel = () => { - const { datasetIds, locationId } = proxy.$route.params - setActiveLocationIds([locationId]) - loadPointDataForLocation({ datasetIds, locationId }) - } - - const close = () => { - proxy.$router.push({ - path: `/data/${proxy.$route.params.datasetIds}`, - params: { datasetIds: proxy.$route.params.datasetIds } - }) } - - return { - close, - option, - expandedDatasets, - datasets, - hasSerieData, - locations, - getTimeStep, - activeSummaryId, - updateLocationPanel, + }, + + mounted() { + setTimeout(this.updateLocationPanel, 3000); + this.expandedDatasets = [...Array(this.datasets.length).keys()]; + }, + + methods: { + ...mapMutations(['clearActiveLocationIds', 'setActiveLocationIds']), + ...mapActions(['loadPointDataForLocation']), + updateLocationPanel() { + const { datasetIds, locationId } = this.$route.params; + console.log('Inside updateLocationPanel:', { datasetIds, locationId }); + this.setActiveLocationIds([locationId]); + // this.loadPointDataForLocation({ datasetIds, locationId }); + }, + close() { + this.$router.push({ + path: `/data/${this.$route.params.datasetIds}`, + params: { datasetIds: this.$route.params.datasetIds } + }); } } -} +};