run.py

import os
import ee
import geemap.foliumap as geemap
import streamlit as st
import pandas   as  pd
import numpy as np

my_data = os.environ.get('my_data')
my_image = os.environ.get('my_image')

st.set_page_config(page_title="TPL MAPPING",layout="wide")

st.markdown("""
    <h1 style='text-align: center;'>Lake Distribution map of Tibet Plateau 🏔️</h1>
    <h3 style='text-align: center;'><font color=Blue>YuJunchuan </font>(AGRS)</h3>
    <br/>
""", unsafe_allow_html=True)

# geemap.set_proxy(33210)

row1_col1, row1_col2, row1_col3 = st.columns([6, 2,1])
# row1_col1, row1_col2 = st.columns([7, 2])

Map = geemap.Map()

region = ee.FeatureCollection(my_data)

datastart='2021-06-01'
dataend='2021-10-15'

def rmCloudByQA(image):
    qa = image.select('QA60')
    cloudBitMask = 1 << 10
    cirrusBitMask = 1 << 11 
    mask =qa.bitwiseAnd(cloudBitMask).eq(0)and(qa.bitwiseAnd(cirrusBitMask).eq(0))
    return image.updateMask(mask); 

S2 = (ee.ImageCollection('COPERNICUS/S2_SR')
    .filterDate(datastart,dataend)
    .filterBounds(region)
    .filter(ee.Filter.lt('CLOUDY_PIXEL_PERCENTAGE', 50))
    .map(rmCloudByQA)
    .select('B.*')
    .median()
    .clip(region))

pred = ee.Image(my_image)
# 
def pred_mask(pred,threshold):
    mask=pred.where(pred.lt(threshold),0).where(pred.gte(threshold),1).toInt()
    mask=mask.setDefaultProjection('epsg:4326',None,10)
    water=mask.updateMask(mask.gt(0.5))
    return water

with row1_col3:
    st.sidebar.title("About")
    st.sidebar.info(
        """
        This web [app](https://junchuanyu-ldtp.hf.space) is maintained by [Junchuan Yu](https://junchuanyu.netlify.app/posts/). You can follow me on social media:
            [GitHub](https://github.com/JunchuanYu) | [Zhihu](https://twitter.com/giswqs) .
        
         An 8-band combination (B4, B3, B2, B8, B11, B12, MNDWI, SDWI) of Sentinel-2 and Sentinel-1 was used for training and lake extraction. The model uses a multi-scale deep neural network based on transfer learning and is implemented using OTOP technology
    """
    )
    st.sidebar.title("Contect")
    st.sidebar.info("Email: jason.yu.mail@qq.com")
    
with row1_col2:
   
    basemaps = ['HYBRID', 'SATELLITE', 'TERRAIN']
    basemap = st.selectbox("🗺️BASEMAP", basemaps,index=basemaps.index('HYBRID'))
    Map.add_basemap(basemap)
            
    Typicallakes = ["Typical Lakes", "Qinghai Lake", "Selincuo", "Zhaling Lake", "Eling Lake", "Zhuonai Lake", "Margai Chaka", "Kokexili Lake"]
    lakeword = st.selectbox("🌊Typical Lakes", Typicallakes)
    if lakeword == "Qinghai Lake":
        Map.setCenter(100.192956,36.936857, zoom=9)
    elif lakeword == "Selincuo":
        Map.setCenter(88.955657,31.810172, zoom=10)
    elif lakeword == "Zhaling Lake":
        Map.setCenter(97.294221,34.938479, zoom=11)
    elif lakeword == "Eling Lake":
        Map.setCenter(97.70816,34.91575, zoom=11)
    elif lakeword == "Zhuonai Lake":
        Map.setCenter(91.944098,35.555848, zoom=11)       
    elif lakeword == "Margai Chaka":
        Map.setCenter(86.768704,35.133507, zoom=12)     
    elif lakeword == "Kokexili Lake":
        Map.setCenter(91.129067,35.595563, zoom=11)                      
    else:
        Map.setCenter(87.745,33.092, zoom=6)
    
    Threshold = st.slider('♎Threshold', 0, 255, 128)
    water=pred_mask(pred,Threshold)
    
    split = st.checkbox("⛩️Split View")
    if split:
        left_layer = geemap.ee_tile_layer(water, {'min': 0, 'max':1, 'palette': '0905ff'}, name='water',opacity=0.5)
        right_layer = geemap.ee_tile_layer(S2, {'min': 0, 'max':3000, 'bands': ['B4', 'B3', 'B2']},name='Image',shown=False)
        Map.split_map(left_layer, right_layer)
    else:
        Map.addLayer(water, {'min': 0, 'max':1, 'palette': '0905ff'}, name='water',opacity=0.7)
    st.markdown("", unsafe_allow_html=True)
    st.markdown("👍 you can follow the WeChat public account [45度科研人] and leave me a message!", unsafe_allow_html=True)
    st.markdown("""<div align=center><img width = '150' height ='150' src ="https://dunazo.oss-cn-beijing.aliyuncs.com/blog/wechat-simple.png"/></div>""", unsafe_allow_html=True)    

with row1_col1:

    Map.to_streamlit(weight=900,height=750)