Skip to content

Commit

Permalink
date and point update
Browse files Browse the repository at this point in the history
  • Loading branch information
@ronygolderku
ronygolderku committed Oct 4, 2024
1 parent d61c8ff commit 3e82a3b
Show file tree
Hide file tree
Showing 7 changed files with 45 additions and 17 deletions.
Binary file modified __pycache__/callbacks.cpython-312.pyc
View file
Binary file not shown.
2 changes: 2 additions & 0 deletions assets/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,13 +78,15 @@ body {
flex: 1 1 30%; /* Allows flexibility for responsiveness */
padding: 10px;
box-sizing: border-box;
height: 100vh; /* Full height */
}

/* Right panel (Controls) */
.right-panel {
flex: 1 1 65%;
padding: 10px;
box-sizing: border-box;
height: 100vh; /* Full height */
}

/* Control elements in the right panel */
Expand Down
24 changes: 18 additions & 6 deletions callbacks.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -330,11 +330,21 @@ def highlight_feature(n_clicks, point, polygon, aoi_type):

# Update the map to highlight the selected point or polygon
@app.callback(
[Output("points-layer", "children"), Output("highlighted-layer", "children")],
Input("highlight-data", "data")
)
def update_map_highlight(data):
points_layer = create_points_layer()
[Output("points-layer", "children"), Output("highlighted-layer", "children")],
[Input("highlight-data", "data"),
Input("dataset-type", "value")] # Add dataset-type input
)
def update_map_highlight(data, dataset_type):
# Set point limit based on dataset_type
if dataset_type in ['olci', 'mur']:
point_limit = 32
else:
point_limit = 13

# Create points layer with point limit
points_layer = create_points_layer(point_limit)

# Initialize highlighted layer
highlighted_layer = []

if data:
Expand All @@ -359,4 +369,6 @@ def update_map_highlight(data):
id="highlighted-polygon",
options=dict(style=dict(color="red", weight=5, fillOpacity=0.1))
))
return points_layer, highlighted_layer

# Return updated points and highlighted layers
return points_layer, highlighted_layer
Binary file modified pages/__pycache__/data_viz.cpython-312.pyc
View file
Binary file not shown.
Binary file modified pages/__pycache__/home.cpython-312.pyc
View file
Binary file not shown.
26 changes: 20 additions & 6 deletions pages/data_viz.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,19 +30,30 @@
print(f"Error reading {shapefile}: {e}")

# Create point markers
def create_points_layer(selected_point=None):
def create_points_layer(point_limit, selected_point=None):
points_layer = []
for idx, row in points_df.iterrows():
if idx >= point_limit:
break # Stop when the point limit is reached
color = "red" if selected_point and selected_point == idx + 1 else "blue"
points_layer.append(
dl.Marker(
position=[row['latitude'], row['longitude']],
children=dl.Tooltip(f"Point: {row['Points']}, Location: {row['label']}")),
children=dl.Tooltip(f"Point: {row['Points']}, Location: {row['label']}"),
),
)
return points_layer

# Create a generic layout function
def create_layout(title, map_id, variable_options, dataset_type, geojson_data, point_range, dataset_info, wmts_layers, layer_name):
# set point limit: 32 for olci and ghrsst, 13 for others
if dataset_type in ['olci', 'mur']:
point_limit = 32
else:
point_limit = 13

points_layer = dl.LayerGroup(create_points_layer(point_limit), id="points-layer")

return html.Div([
html.H2(f'{title} Data Visualization', className="heading"),
html.Hr(),
Expand All @@ -58,7 +69,7 @@ def create_layout(title, map_id, variable_options, dataset_type, geojson_data, p
url="https://server.arcgisonline.com/ArcGIS/rest/services/Ocean/World_Ocean_Base/MapServer/tile/{z}/{y}/{x}",
id="ocean-basemap"
),
dl.LayerGroup(id="points-layer"),
# dl.LayerGroup(id="points-layer"),
dl.ScaleControl(position="bottomleft"),
dl.FullScreenControl(),

Expand All @@ -75,7 +86,8 @@ def create_layout(title, map_id, variable_options, dataset_type, geojson_data, p
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
), name="OpenStreetMap"
),
dl.Overlay(dl.LayerGroup(id="points-layer"), name="Points", checked=False),
dl.Overlay(points_layer, name="Points", checked=False),
# dl.Overlay(dl.LayerGroup(id="points-layer"), name="Points", checked=False),
dl.Overlay(
dl.LayerGroup(
[dl.GeoJSON(data=geojson_data[name], id=f"geojson-{name}") for name in geojson_data]
Expand All @@ -86,7 +98,7 @@ def create_layout(title, map_id, variable_options, dataset_type, geojson_data, p
], position="topright"
)
],
style={'width': '100%', 'height': '680px'},
style={'width': '100%', 'height': '100%'},
center=[-32.1, 115.4], zoom=9, id=map_id
)
], className='left-panel'), # CSS class for map responsiveness
Expand Down Expand Up @@ -128,7 +140,7 @@ def create_layout(title, map_id, variable_options, dataset_type, geojson_data, p
html.Label("Select Point"),
dcc.Dropdown(
id="coordinate-input-point",
options=[{'label': f'Point {i}', 'value': str(i)} for i in range(1, point_range + 1)],
options=[{'label': f'Point {i}', 'value': str(i)} for i in range(1, point_range)],
className="input-dropdown"
)
], id='point-selector', style={'display': 'none'}),
Expand All @@ -149,6 +161,7 @@ def create_layout(title, map_id, variable_options, dataset_type, geojson_data, p
html.Label("From"),
dcc.DatePickerSingle(
id="start-date-picker",
display_format="DD/MM/YYYY",
placeholder="Start Date",
className="DatePickerSingle"
)
Expand All @@ -158,6 +171,7 @@ def create_layout(title, map_id, variable_options, dataset_type, geojson_data, p
html.Label("To"),
dcc.DatePickerSingle(
id="end-date-picker",
display_format="DD/MM/YYYY",
placeholder="End Date",
className="DatePickerSingle"
)
Expand Down
10 changes: 5 additions & 5 deletions pages/home.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -114,7 +114,7 @@ def home_layout():
"margin": "0 auto"
})
])
], style={"background-color": "#a4c126", "border": "1px solid #dee2e6", "padding": "10px", "margin": "10px"}), width=4),
], style={"background-color": "#a4c126", "border": "1px solid #dee2e6", "padding": "10px", "margin": "10px"}), width=12, md=4),
dbc.Col(dbc.Card([
dbc.CardBody([
html.H4("Total Datasets", className="card-title", style={"text-align": "center", "font-weight": "bold"}),
Expand All @@ -129,7 +129,7 @@ def home_layout():
"margin": "0 auto"
})
])
], style={"background-color": "#008bad", "border": "1px solid #dee2e6", "padding": "10px", "margin": "10px"}), width=4),
], style={"background-color": "#008bad", "border": "1px solid #dee2e6", "padding": "10px", "margin": "10px"}), width=12, md=4),
dbc.Col(dbc.Card([
dbc.CardBody([
html.H4("Variables", className="card-title", style={"text-align": "center", "font-weight": "bold"}),
Expand All @@ -144,7 +144,7 @@ def home_layout():
"margin": "0 auto"
})
])
], style={"background-color": "#f3bc00", "border": "1px solid #dee2e6", "padding": "10px", "margin": "10px"}), width=4),
], style={"background-color": "#f3bc00", "border": "1px solid #dee2e6", "padding": "10px", "margin": "10px"}), width=12, md=4),
], className="mb-4"),
]),

Expand Down Expand Up @@ -172,10 +172,10 @@ def home_layout():
html.Li([html.Span("OSTIA: ", style={"font-weight": "bold"}), "Operational Sea Surface Temperature and Sea Ice Analysis"]),
], style={"margin-bottom": "20px"}) # Add space between lists
], style={"padding": "10px", "flex": "1"}) # Right column with the full forms
], width=6),
], width=12, md=6),
dbc.Col([
dcc.Graph(figure=create_sunburst_chart()), # Left column with the figure
], width=6)
], width=12, md=6)
], style={"margin-bottom": "20px"}),
]),

Expand Down

0 comments on commit 3e82a3b

Please sign in to comment.