def make_empty_map(lat_center=51.326863, lon_center=10.354922, zoom=5):
fig = [
dl.Map(
[
dl.TileLayer(url=mapURL,
attribution=attribution,
tileSize=512,
zoomOffset=-1),
dl.LayerGroup(id="layer"),
dl.WMSTileLayer(url="https://maps.dwd.de/geoserver/ows?",
layers="dwd:RX-Produkt",
format="image/png",
transparent=True,
opacity=0.7,
version='1.3.0',
detectRetina=True),
dl.LocateControl(
options={'locateOptions': {
'enableHighAccuracy': True
}}),
],
center=[lat_center, lon_center],
zoom=zoom,
style={
'width': '100%',
'height': '45vh',
'margin': "auto",
"display": "block"
},
id='map')
]
return fig
def generate_map_plot(data):
if data is not None:
start_point = data['STATION_NAME'].item()
point = [data['LAT'].item(), data['LON'].item()]
fig = [
dl.Map(
[
dl.TileLayer(url=mapURL,
attribution=attribution,
tileSize=512,
zoomOffset=-1),
dl.LayerGroup(id="layer"),
dl.WMSTileLayer(url="https://maps.dwd.de/geoserver/ows?",
layers="dwd:SAT_WELT_KOMPOSIT",
format="image/png",
transparent=True,
opacity=0.7,
version='1.3.0',
detectRetina=True),
dl.WMSTileLayer(url="https://maps.dwd.de/geoserver/ows?",
layers="dwd:SAT_EU_RGB",
format="image/png",
transparent=True,
opacity=0.7,
version='1.3.0',
detectRetina=True),
dl.LocateControl(options={
'locateOptions': {
'enableHighAccuracy': True
}
}),
dl.Marker(position=point,
children=dl.Tooltip(start_point)),
],
center=point,
zoom=4,
style={
'width': '100%',
'height': '35vh',
'margin': "auto",
"display": "block"
},
id='map')
]
else: # make an empty map
fig = make_empty_map()
return fig
def generate_map_plot(df):
if df is not None:
lons = df.lons.values
lats = df.lats.values
trajectory = np.vstack([lats, lons]).T.tolist()
start_point = df.source.values[0]
end_point = df.destination.values[0]
zoom, center = zoom_center(lons, lats, width_to_height=8)
fig = [
dl.Map(
[
dl.TileLayer(url=mapURL,
attribution=attribution,
tileSize=512,
zoomOffset=-1),
dl.LayerGroup(id="layer"),
dl.WMSTileLayer(url="https://maps.dwd.de/geoserver/ows?",
layers="dwd:RX-Produkt",
format="image/png",
transparent=True,
opacity=0.7),
dl.LocateControl(options={
'locateOptions': {
'enableHighAccuracy': True
}
}),
dl.Polyline(positions=trajectory),
dl.Marker(position=trajectory[0],
children=dl.Tooltip(start_point)),
dl.Marker(position=trajectory[-1],
children=dl.Tooltip(end_point))
],
center=[center['lat'], center['lon']],
zoom=zoom,
style={
'width': '100%',
'height': '45vh',
'margin': "auto",
"display": "block"
},
id='map')
]
else: # make an empty map
fig = make_empty_map()
return fig
import json
import dash
import dash_leaflet as dl
from django_plotly_dash import DjangoDash
import dash_leaflet.express as dlx
import dash_html_components as html
from dash.dependencies import Input, Output, State
import pandas as pd
import numpy as np
import dash_core_components as dcc
app = DjangoDash("MapApp", prevent_initial_callbacks=True)
app.layout = html.Div([
dl.Map([
dl.TileLayer(),
dl.LocateControl(
options={'locateOptions': {
'enableHighAccuracy': True
}})
],
id="map",
style={
'width': '100%',
'height': '50vh',
'margin': "auto",
"display": "block"
}),
html.Div(id="text")
])
def load_results(n_clicks, postal):
#df = get_results('CCBDEV7')
df = data
if postal is not None:
df = df[df.POSTAL.isin([postal])]
#df[['ACCT_ID','PREM_ID','ETOR_NUM']] = df[['ACCT_ID','PREM_ID','ETOR_NUM']].astype('int64')
#df[['PREMLAT','PREMLONG']] = df[['PREMLAT','PREMLONG']].astype(float)
positions = df[['PREMLAT', 'PREMLONG']].values.tolist()
premiseId = df[['PREM_ID']].values.tolist()
accountId = df[['ACCT_ID']].values.tolist()
etorNoList = df[['ETOR_NUM']].values.tolist()
Row_list = []
# Iterate over each row
for index, rows in df.iterrows():
# Create list for the current row
my_list = [rows.PREMLAT, rows.PREMLONG]
Row_list.append(my_list)
marker = []
for row, premise, account, etorNo in zip(Row_list, premiseId, accountId,
etorNoList):
etor = int(''.join(map(str, etorNo)))
if etor < 11:
marker_temp = dl.Marker(
position=row,
icon={
"iconUrl": "/assets/smile3.png",
"iconSize": [35, 35]
},
children=[
dl.Tooltip("Premise - " + ' '.join(map(str, premise))),
dl.Popup([
html.H1("Details"),
html.P("Customer Outage Experience"),
html.P("Location = " + ' '.join(map(str, row))),
html.P("Premise Id = " + ' '.join(map(str, premise))),
html.P("Account Id = " + ' '.join(map(str, account))),
])
])
marker.append(marker_temp)
elif etor > 10 and etor < 21:
marker_temp = dl.Marker(
position=row,
icon={
"iconUrl": "/assets/sad.png",
"iconSize": [35, 35]
},
children=[
dl.Tooltip("Premise - " + ' '.join(map(str, premise))),
dl.Popup([
html.H1("Details"),
html.P("Customer Outage Experience"),
html.P("Location = " + ' '.join(map(str, row))),
html.P("Premise Id = " + ' '.join(map(str, premise))),
html.P("Account Id = " + ' '.join(map(str, account))),
])
])
marker.append(marker_temp)
elif etor > 20:
marker_temp = dl.Marker(
position=row,
icon={
"iconUrl": "/assets/angry.png",
"iconSize": [35, 35]
},
children=[
dl.Tooltip("Premise - " + ' '.join(map(str, premise))),
dl.Popup([
html.H1("Details"),
html.P("Customer Outage Experience"),
html.P("Location = " + ' '.join(map(str, row))),
html.P("Premise Id = " + ' '.join(map(str, premise))),
html.P("Account Id = " + ' '.join(map(str, account))),
])
])
marker.append(marker_temp)
cluster = dl.MarkerClusterGroup(
id="markers",
children=marker,
options={"polygonOptions": {
"color": "red"
}})
result = [
dl.TileLayer(url="https://a.tile.openstreetmap.org/{z}/{x}/{y}.png"),
dl.LocateControl(
options={'locateOptions': {
'enableHighAccuracy': True
}}), cluster
]
return [result]