Skip to content

Commit a08caeb

Browse files
sirmmosirmmo
committed
updates
1 parent 3f16c6e commit a08caeb

File tree

11 files changed

+317
-196
lines changed

11 files changed

+317
-196
lines changed

‎src/app/Services/API/Requests/index.ts‎

Lines changed: 26 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,14 @@ export class RequestApi extends Http {
7070
]),
7171
);
7272
const labels = Object.fromEntries(labelsf.flat());
73-
const innerConf = { ...configuration };
73+
const innerConf = {
74+
...configuration,
75+
...{
76+
download_reason: dataSet.downloadReason,
77+
entity_name: dataSet.entity_name,
78+
is_public_sector: dataSet.is_public_sector === 'true',
79+
},
80+
};
7481
delete innerConf.archive;
7582
if (innerConf.aggregation_period === 'annual') {
7683
delete innerConf.time_window;
@@ -461,7 +468,8 @@ export class RequestApi extends Http {
461468
return res;
462469
};
463470

464-
public createIds(pattern: string, items: any) {
471+
public createIds(items: any) {
472+
console.log('pattern');
465473
let ret: string[] = [];
466474
let titems: any[] = [];
467475

@@ -475,14 +483,24 @@ export class RequestApi extends Http {
475483
}
476484
}
477485
const combs = this.cartesianProduct(titems);
486+
const reqs: Promise<any>[] = [];
478487
for (const c of combs) {
479-
let tpattern = pattern;
480-
for (let j of Object.keys(c)) {
481-
tpattern = tpattern.replaceAll('{' + j + '}', c[j]);
482-
}
483-
ret.push(tpattern);
488+
reqs.push(
489+
this.doGetLayer(
490+
c.climatological_variable,
491+
c.climatological_model,
492+
c.scenario,
493+
c.measure,
494+
c.time_period,
495+
c.aggregation_period,
496+
c.season,
497+
c.archive,
498+
),
499+
);
484500
}
485-
return ret;
501+
return Promise.all(reqs).then(data => {
502+
return data.map(x => x.identifier);
503+
});
486504
}
487505

488506
public getTimeseriesV2 = (

‎src/app/components/Map/DynamicStationsLayer.tsx‎

Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
import L from 'leaflet';
2+
import { Circle, CircleMarker, Popup, Pane, useMap } from 'react-leaflet';
3+
import { useSelector } from 'react-redux';
4+
import { useLeafletContext, withPane } from '@react-leaflet/core';
5+
import React, { useEffect, useRef, useState } from 'react';
6+
import 'leaflet.vectorgrid';
7+
import { BACKEND_VECTOR_TILES_URL } from '../../../utils/constants';
8+
9+
import { Button, Paper, Box, IconButton, Typography } from '@mui/material';
10+
import { MapPopup } from '../MapSearch';
11+
12+
import { PopupStyle } from './styles';
13+
14+
export const DynamicStationsLayer = (props: any) => {
15+
const { selected_map } = useSelector((state: any) => state.map);
16+
const {
17+
selectCallback,
18+
selectedPoint,
19+
openCharts,
20+
zIndex,
21+
variable,
22+
data,
23+
url,
24+
} = props;
25+
const map = useMap();
26+
const context = useLeafletContext();
27+
// console.log(context.map.latLngToLayerPoint(selectedPoint.latlng))
28+
// const [selected, setSelected] = useState<any>(null);
29+
30+
useEffect(() => {
31+
let selected = false;
32+
// let hovered = false;
33+
const container = context.layerContainer || context.map;
34+
35+
if (url) {
36+
context.map.createPane('stationssel');
37+
// @ts-ignore
38+
context.map.getPane('stationssel').style.zIndex = zIndex;
39+
40+
// @ts-ignore
41+
let vectorLayer = L.vectorGrid.protobuf(url, {
42+
interactive: true,
43+
pane: 'stationssel',
44+
vectorTileLayerStyles: {
45+
stationssel: (properties, zoom, geometryDimension) => {
46+
let opacity = 0.9;
47+
let color = data === 'future' ? '#abb2b9' : '#464b52';
48+
// console.log(zoom, color, opacity)
49+
return {
50+
color: color,
51+
weight: data === 'future' ? 2 : 4,
52+
radius: data === 'future' ? 5 : 10,
53+
fill: true,
54+
fillOpacity: 0.7,
55+
opacity: opacity,
56+
};
57+
},
58+
},
59+
});
60+
61+
context.map.addLayer(vectorLayer);
62+
vectorLayer.bringToFront();
63+
64+
return () => {
65+
// console.log('RETURN')
66+
try {
67+
// @ts-ignore
68+
if (vectorLayer) container.removeLayer(vectorLayer);
69+
} catch (e) {
70+
console.log('error REMOVING', e);
71+
}
72+
};
73+
}
74+
}, [
75+
selected_map,
76+
map,
77+
selectedPoint,
78+
context.layerContainer,
79+
context.map,
80+
selectCallback,
81+
url,
82+
]);
83+
84+
return (
85+
selectedPoint && (
86+
<Pane name="custom" style={{ zIndex: 1000 }}>
87+
<CircleMarker
88+
center={[selectedPoint.latlng.lat, selectedPoint.latlng.lng]}
89+
radius={2}
90+
pathOptions={{ color: '#164d36' }}
91+
>
92+
<Popup>
93+
<Box sx={PopupStyle}></Box>
94+
</Popup>
95+
</CircleMarker>
96+
</Pane>
97+
)
98+
);
99+
};

‎src/app/components/Map/StationsLayer.tsx‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,15 @@ import { PopupStyle } from './styles';
1313

1414
export const StationsLayer = (props: any) => {
1515
const { selected_map } = useSelector((state: any) => state.map);
16-
const { selectCallback, selectedPoint, openCharts, zIndex, variable, data } =
17-
props;
16+
const {
17+
selectCallback,
18+
selectedPoint,
19+
openCharts,
20+
zIndex,
21+
variable,
22+
data,
23+
url,
24+
} = props;
1825
const map = useMap();
1926
const context = useLeafletContext();
2027
// console.log(context.map.latLngToLayerPoint(selectedPoint.latlng))
@@ -37,7 +44,7 @@ export const StationsLayer = (props: any) => {
3744
vectorTileLayerStyles: {
3845
stations: (properties, zoom, geometryDimension) => {
3946
let opacity = 0.9;
40-
let color = '#528ed2';
47+
let color = data === 'future' ? '#bdc2cf' : '#778494';
4148
// console.log(zoom, color, opacity)
4249
return {
4350
color: color,

‎src/app/components/Map/index.tsx‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ import { RequestApi } from 'app/Services';
4444
import { UncertaintySwitch } from './UncertaintySwitch';
4545
import { useTranslation } from 'react-i18next';
4646
import { StationsLayer } from './StationsLayer';
47+
import { DynamicStationsLayer } from './DynamicStationsLayer';
4748

4849
// import {BaseLayerControl} from "./BaseLayerControl";
4950

@@ -346,8 +347,15 @@ const Map = (props: MapProps) => {
346347
<StationsLayer
347348
data={data}
348349
variable={currentMap.climatological_variable}
350+
url={currentMap.observation_stations_vector_tile_layer_url}
349351
zIndex={550}
350352
></StationsLayer>
353+
<DynamicStationsLayer
354+
data={data}
355+
variable={currentMap.climatological_variable}
356+
url={currentMap.observation_stations_vector_tile_layer_url}
357+
zIndex={575}
358+
></DynamicStationsLayer>
351359
<VectorWrapperLayer
352360
zIndex={600}
353361
mode={mode}

‎src/app/components/MapMenuBar/index.tsx‎

Lines changed: 8 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -122,7 +122,8 @@ export function MapMenuBar(props: MapMenuBar) {
122122
const mapParameters = (mapKey, parameterListKey) => {
123123
if (forecast_parameters) {
124124
const fp = forecast_parameters.filter(x => x.name === mapKey)[0];
125-
const items = fp.allowed_values.map(item => {
125+
const items = fp.allowed_values?.map(item => {
126+
//TODO: Controllre caso in cui fp sia vuoto
126127
return {
127128
...item,
128129
disabled: false,
@@ -205,15 +206,15 @@ export function MapMenuBar(props: MapMenuBar) {
205206
key:
206207
map_data === 'future'
207208
? 'aggregation_period'
208-
: 'historical_aggregation_period',
209+
: 'aggregation_period',
209210
groupName: t('app.map.menu.dataSeries'),
210211
...mapParameters(
211212
map_data === 'future'
212213
? 'aggregation_period'
213-
: 'historical_aggregation_period',
214+
: 'aggregation_period',
214215
map_data === 'future'
215216
? 'aggregation_period'
216-
: 'historical_aggregation_period',
217+
: 'aggregation_period',
217218
),
218219
disableable: true,
219220
disabled: x => false,
@@ -230,18 +231,11 @@ export function MapMenuBar(props: MapMenuBar) {
230231
criteria: (x, c) => x?.measure,
231232
},
232233
{
233-
key:
234-
map_data === 'future'
235-
? 'time_window'
236-
: 'climatological_standard_normal',
234+
key: map_data === 'future' ? 'time_window' : 'time_window',
237235
groupName: t('app.map.menu.timeWindows'),
238236
...mapParameters(
239-
map_data === 'future'
240-
? 'time_window'
241-
: 'climatological_standard_normal',
242-
map_data === 'future'
243-
? 'time_window'
244-
: 'climatological_standard_normal',
237+
map_data === 'future' ? 'time_window' : 'time_window',
238+
map_data === 'future' ? 'time_window' : 'time_window',
245239
),
246240
disableable: true,
247241
disabled: x => x.aggregation_period !== '30yr',

0 commit comments

Comments
 (0)
⚡