def layout(self) -> wcc.FlexBox:
return wcc.FlexBox(children=[
html.Div(
style={"flex": 1},
children=[
self.well_layout,
self.surface_names_layout,
self.seismic_layout,
self.ensemble_layout,
self.marginal_log_layout,
self.intersection_option,
],
),
html.Div(
id=self.ids("viz_wrapper"),
style={
"position": "relative",
"flex": 8
},
children=[
html.Div(wcc.Graph(id=self.ids("graph"))),
html.Div(
id=self.ids("map_wrapper"),
style={
"position": "absolute",
"width": "30%",
"height": "40%",
"right": 100,
"top": 350,
"zIndex": 10000,
"visibility": "hidden",
},
children=[
self.map_layout,
LeafletMap(
id=self.ids("map"),
layers=[],
unitScale={},
autoScaleMap=True,
minZoom=-5,
updateMode="update",
mouseCoords={"position": "bottomright"},
colorBar={"position": "bottomleft"},
),
],
),
html.Button(
style={"float": "right"},
id=self.ids("show_map"),
children="Show map",
),
dcc.Store(id=self.ids("fencespec"),
storage_type="session",
data=[]),
],
),
], )
def map_layout(
uuid: str,
leaflet_id: str,
synced_uuids: Optional[List[str]] = None,
draw_polyline: bool = False,
) -> html.Div:
synced_uuids = synced_uuids if synced_uuids else []
props: Optional[Dict] = (
{
"drawTools": {
"drawMarker": False,
"drawPolygon": False,
"drawPolyline": True,
"position": "topright",
}
}
if draw_polyline
else {}
)
return html.Div(
children=[
html.Label(
style={"textAlign": "center", "fontSize": "0.8em"},
id={"id": uuid, "element": "label"},
),
html.Div(
style={
"height": "37vh",
},
children=LeafletMap(
syncedMaps=synced_uuids,
id=leaflet_id,
layers=[],
unitScale={},
autoScaleMap=True,
minZoom=-19,
updateMode="replace",
mouseCoords={"position": "bottomright"},
colorBar={"position": "bottomleft"},
switch={
"value": False,
"disabled": False,
"label": "Hillshading",
},
**props
),
),
],
)
def layout(self) -> html.Div:
return html.Div(
children=[
html.Div(
style=self.set_grid_layout("1fr 1fr 1fr 1fr 1fr"),
children=[
self.well_layout,
self.well_options,
self.seismic_layout,
self.viz_options_layout,
html.Button(
id=self.ids("show_map"),
children="Show map",
),
],
),
html.Div(
id=self.ids("viz_wrapper"),
style={"position": "relative"},
children=[
html.Div(
id=self.ids("map_wrapper"),
style={
"position": "absolute",
"width": "30%",
"height": "40%",
"right": 0,
"zIndex": 10000,
"visibility": "hidden",
},
children=LeafletMap(
id=self.ids("map"),
layers=[],
unitScale={},
autoScaleMap=True,
minZoom=-19,
updateMode="update",
mouseCoords={"position": "bottomright"},
colorBar={"position": "bottomleft"},
),
),
wcc.Graph(id=self.ids("graph")),
],
),
],
)
def layout(self) -> html.Div:
return html.Div(
id=self.uuid("layout"),
children=[
wcc.FlexBox(
style={"fontSize": "1rem"},
children=[
html.Div(
id=self.uuid("settings-view1"),
style={"margin": "10px", "flex": 4},
children=[
self.selector.layout,
self.ensemble_layout(
ensemble_id=self.uuid("ensemble"),
ens_prev_id=self.uuid("ensemble-prev"),
ens_next_id=self.uuid("ensemble-next"),
real_id=self.uuid("realization"),
real_prev_id=self.uuid("realization-prev"),
real_next_id=self.uuid("realization-next"),
),
],
),
html.Div(
style={"margin": "10px", "flex": 4},
id=self.uuid("settings-view2"),
children=[
self.selector2.layout,
self.ensemble_layout(
ensemble_id=self.uuid("ensemble2"),
ens_prev_id=self.uuid("ensemble2-prev"),
ens_next_id=self.uuid("ensemble2-next"),
real_id=self.uuid("realization2"),
real_prev_id=self.uuid("realization2-prev"),
real_next_id=self.uuid("realization2-next"),
),
],
),
html.Div(
style={"margin": "10px", "flex": 4},
id=self.uuid("settings-view3"),
children=[
html.Label("Calculation"),
html.Div(
dcc.Dropdown(
id=self.uuid("calculation"),
value="Difference",
clearable=False,
options=[
{"label": i, "value": i}
for i in [
"Difference",
"Sum",
"Product",
"Quotient",
]
],
persistence=True,
persistence_type="session",
)
),
wcc.FlexBox(
children=[
html.Div(
style={"width": "20%", "flex": 1},
children=[
html.Label("Truncate Min"),
dcc.Input(
debounce=True,
type="number",
id=self.uuid("truncate-diff-min"),
persistence=True,
persistence_type="session",
),
],
),
html.Div(
style={"width": "20%", "flex": 1},
children=[
html.Label("Truncate Max"),
dcc.Input(
debounce=True,
type="number",
id=self.uuid("truncate-diff-max"),
persistence=True,
persistence_type="session",
),
],
),
html.Label(
style={"fontSize": "1.2rem"},
id=self.uuid("map3-label"),
),
]
),
],
),
],
),
wcc.FlexBox(
style={"fontSize": "1rem"},
children=[
html.Div(
style={
"height": self.map_height,
"margin": "10px",
"flex": 4,
},
children=[
LeafletMap(
syncedMaps=[self.uuid("map2"), self.uuid("map3")],
id=self.uuid("map"),
layers=[],
unitScale={},
autoScaleMap=True,
minZoom=-19,
updateMode="replace",
mouseCoords={"position": "bottomright"},
colorBar={"position": "bottomleft"},
switch={
"value": False,
"disabled": False,
"label": "Hillshading",
},
),
],
),
html.Div(
style={"margin": "10px", "flex": 4},
children=[
LeafletMap(
syncedMaps=[self.uuid("map"), self.uuid("map3")],
id=self.uuid("map2"),
layers=[],
unitScale={},
autoScaleMap=True,
minZoom=-19,
updateMode="replace",
mouseCoords={"position": "bottomright"},
colorBar={"position": "bottomleft"},
switch={
"value": False,
"disabled": False,
"label": "Hillshading",
},
)
],
),
html.Div(
style={"margin": "10px", "flex": 4},
children=[
LeafletMap(
syncedMaps=[self.uuid("map"), self.uuid("map2")],
id=self.uuid("map3"),
layers=[],
unitScale={},
autoScaleMap=True,
minZoom=-19,
updateMode="replace",
mouseCoords={"position": "bottomright"},
colorBar={"position": "bottomleft"},
switch={
"value": False,
"disabled": False,
"label": "Hillshading",
},
)
],
),
dcc.Store(
id=self.uuid("attribute-settings"),
data=json.dumps(self.attribute_settings),
storage_type="session",
),
],
),
],
)
def surface_layout(self):
"""Layout for surface section"""
return html.Div(children=[
wcc.FlexBox(children=[
html.Div(children=[
html.Label(
style={
"font-weight": "bold",
"textAlign": "center",
},
children="Select surface",
),
dcc.Dropdown(
id=self.ids("surface"),
options=[{
"label": name,
"value": path
} for name, path in zip(self.surfacenames,
self.surfacefiles)],
value=self.surfacefiles[0],
clearable=False,
persistence=True,
persistence_type="session",
),
]),
html.Div(children=[
dcc.RadioItems(
id=self.ids("surface-type"),
options=[
{
"label": "Display surface z-value",
"value": "surface",
},
{
"label":
"Display seismic attribute as z-value",
"value": "attribute",
},
],
value="surface",
persistence=True,
persistence_type="session",
),
], ),
], ),
html.Div(children=[
html.Div(
style={
"marginTop": "20px",
"height": "800px",
"zIndex": -9999,
},
children=[
LeafletMap(
id=self.ids("map-view"),
autoScaleMap=True,
minZoom=-5,
updateMode="update",
# draw_toolbar_polyline=True,
layers=[
# make_surface_layer(
# xtgeo.RegularSurface(), name="surface"
# )
],
drawTools={
"drawMarker": False,
"drawPolygon": False,
"drawPolyline": True,
"position": "topright",
},
mouseCoords={"position": "bottomright"},
colorBar={"position": "bottomleft"},
),
html.Div(children=[
dcc.RadioItems(
id=self.uuid("hillshade"),
labelStyle={
"display": "inline-block",
"text-align": "justify",
},
options=[
{
"value": None,
"label": "No hillshading",
},
{
"value": "soft-hillshading",
"label": "Soft hillshading",
},
{
"value": "hillshading",
"label": "Hillshading",
},
{
"value": "hillshading_shadows",
"label": "Hillshading with shadows",
},
],
value=None,
persistence=True,
persistence_type="session",
),
]),
],
)
]),
])
def layout(self):
return wcc.FlexBox(
id=self.ids("layout"),
children=[
wcc.Frame(
style={"flex": 1},
children=[
wcc.Selectors(
label="Map settings",
children=[
wcc.Dropdown(
id=self.ids("surface"),
label="Select surface",
options=[{
"label": name,
"value": path
} for name, path in zip(
self.surfacenames, self.surfacefiles)],
value=self.surfacefiles[0],
clearable=False,
),
wcc.RadioItems(
id=self.ids("surface-type"),
options=[
{
"label": "Display surface z-value",
"value": "surface",
},
{
"label":
"Display seismic attribute as z-value",
"value": "attribute",
},
],
value="surface",
),
],
),
wcc.Selectors(
label="Intersection settings",
children=[
wcc.Dropdown(
label="Select seismic cube",
id=self.ids("cube"),
options=[{
"label": Path(cube).stem,
"value": cube
} for cube in self.segyfiles],
value=self.segyfiles[0],
clearable=False,
),
wcc.Label(children="Set colorscale", ),
wcc.ColorScales(
id=self.ids("color-scale"),
colorscale=self.initial_colors,
nSwatches=12,
),
wcc.RangeSlider(
label="Set color range",
id=self.ids("color-values"),
tooltip={
"placement": "bottom",
"always_visible": True,
},
marks=None,
),
html.Button(
id=self.ids("color-range-btn"),
children="Reset Range",
),
],
),
],
),
wcc.Frame(
highlight=False,
style={
"height": "800px",
"flex": 3,
},
children=[
LeafletMap(
id=self.ids("map-view"),
autoScaleMap=True,
minZoom=-19,
updateMode="update",
layers=[],
drawTools={
"drawMarker": False,
"drawPolygon": False,
"drawPolyline": True,
"position": "topright",
},
mouseCoords={"position": "bottomright"},
colorBar={"position": "bottomleft"},
switch={
"value": False,
"disabled": False,
"label": "Hillshading",
},
),
],
),
html.Div(
style={
"flex": 3,
"height": "800px"
},
children=[
wcc.Graph(config={"displayModeBar": False},
id=self.ids("fence-view")),
],
),
],
)
def surface_layout(self):
"""Layout for surface section"""
return html.Div(children=[
wcc.FlexBox(children=[
html.Div(children=[
html.Label(
style={
"font-weight": "bold",
"textAlign": "center",
},
children="Select surface",
),
dcc.Dropdown(
id=self.ids("surface"),
options=[{
"label": name,
"value": path
} for name, path in zip(self.surfacenames,
self.surfacefiles)],
value=self.surfacefiles[0],
clearable=False,
persistence=True,
persistence_type="session",
),
]),
html.Div(children=[
dcc.RadioItems(
id=self.ids("surface-type"),
options=[
{
"label": "Display surface z-value",
"value": "surface",
},
{
"label": "Display grid parameter value",
"value": "attribute",
},
],
value="surface",
persistence=True,
persistence_type="session",
),
], ),
], ),
html.Div(children=[
html.Div(
style={
"marginTop": "20px",
"height": "800px",
"zIndex": -9999,
},
children=[
LeafletMap(
id=self.ids("map-view"),
autoScaleMap=True,
minZoom=-5,
updateMode="update",
drawTools={
"drawMarker": False,
"drawPolygon": False,
"drawPolyline": True,
"position": "topright",
},
mouseCoords={"position": "bottomright"},
colorBar={"position": "bottomleft"},
switch={
"value": False,
"disabled": False,
"label": "Hillshading",
},
),
],
)
]),
])