Initial commit

README.md

@@ -1,13 +1,12 @@
 ---
-title: Solara Template
+title: Solara Geemap
 emoji: 🏃
 colorFrom: blue
-colorTo: green
+colorTo: purple
 sdk: docker
 pinned: false
 license: mit
 app_port: 8765
-duplicated_from: giswqs/solara-template
 ---
 
 Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

pages/00_home.py

@@ -5,15 +5,47 @@ import solara
 def Page():
     with solara.Column(align="center"):
         markdown = """
-        ## A Solara Template for Geospatial Applications
+        ## Earth Engine Web Apps
         
         ### Introduction
 
-        **A collection of [Solara](https://github.com/widgetti/solara) web apps for geospatial applications.**
+        **A collection of Earth Engine web apps developed using [Solara](https://github.com/widgetti/solara) and geemap**
+
+        - Web App: <https://giswqs-solara-geemap.hf.space>
+        - GitHub: <https://github.com/opengeos/solara-geemap>
+        - Hugging Face: <https://huggingface.co/spaces/giswqs/solara-geemap>
+
+        
+        ### How to deploy this app on Hugging Face Spaces
+
+        1. Go to <https://huggingface.co/spaces/giswqs/voila-geospatial/tree/main> and duplicate the space to your own space.
+
+        ![](https://i.imgur.com/4ib5BzB.png)
+
+        2. Set environment variables as needed. For example, if you use Google Earth Engine, you need to set `EARTHENGINE_TOKEN` to your Earth Engine token. The token value should be copied from the following file depending on your operating system:
+
+        ```text
+        Windows: C:\\Users\\USERNAME\\.config\\earthengine\\credentials
+        Linux: /home/USERNAME/.config/earthengine/credentials
+        MacOS: /Users/USERNAME/.config/earthengine/credentials
+        ```
+
+        Simply open the file and copy **ALL** the content to the `EARTHENGINE_TOKEN` environment variable.
+
+        ![](https://i.imgur.com/i04gzyH.png)
+
+        ![](https://i.imgur.com/Ex37Ut7.png)
+
+        3. After the space is built successfully, click the `Embed this Space` menu and find the `Direct URL` for the app, such as <https://giswqs-voila-geospatial.hf.space>.
+
+        ![](https://i.imgur.com/V2Lp0dP.png)
+
+        ![](https://i.imgur.com/klhR5FL.png)
+
+        4. Add your own notebooks to the `notebooks` folder and wait for the app to be rebuilt.
+
+        5. To hide the source code from the notebook, modify `run.sh` and set `--strip_sources=True`.
 
-        - Web App: <https://giswqs-solara-template.hf.space>
-        - GitHub: <https://github.com/opengeos/solara-template>
-        - Hugging Face: <https://huggingface.co/spaces/giswqs/solara-template>
 
         """
 

pages/01_leafmap.py

@@ -1,33 +0,0 @@
-import leafmap
-import solara
-
-zoom = solara.reactive(2)
-center = solara.reactive((20, 0))
-
-
-class Map(leafmap.Map):
-    def __init__(self, **kwargs):
-        super().__init__(**kwargs)
-        # Add what you want below
-        self.add_stac_gui()
-
-
-@solara.component
-def Page():
-    with solara.Column(style={"min-width": "500px"}):
-        # solara components support reactive variables
-        # solara.SliderInt(label="Zoom level", value=zoom, min=1, max=20)
-        # using 3rd party widget library require wiring up the events manually
-        # using zoom.value and zoom.set
-        Map.element(  # type: ignore
-            zoom=zoom.value,
-            on_zoom=zoom.set,
-            center=center.value,
-            on_center=center.set,
-            scroll_wheel_zoom=True,
-            toolbar_ctrl=False,
-            data_ctrl=False,
-            height="780px"
-        )
-        # solara.Text(f"Zoom: {zoom.value}")
-        # solara.Text(f"Center: {center.value}")

pages/02_inspector.py

@@ -0,0 +1,47 @@
+import ee
+import geemap
+
+import solara
+
+
+class Map(geemap.Map):
+    def __init__(self, **kwargs):
+        super().__init__(**kwargs)
+        self.add_ee_data()
+        self.add_layer_manager()
+        self.add_inspector()
+
+    def add_ee_data(self):
+        # Add Earth Engine dataset
+        dem = ee.Image('USGS/SRTMGL1_003')
+        landsat7 = ee.Image('LANDSAT/LE7_TOA_5YEAR/1999_2003').select(
+            ['B1', 'B2', 'B3', 'B4', 'B5', 'B7']
+        )
+        states = ee.FeatureCollection("TIGER/2018/States")
+
+        # Set visualization parameters.
+        vis_params = {
+            'min': 0,
+            'max': 4000,
+            'palette': ['006633', 'E5FFCC', '662A00', 'D8D8D8', 'F5F5F5'],
+        }
+
+        # Add Earth Engine layers to Map
+        self.addLayer(
+            landsat7,
+            {'bands': ['B4', 'B3', 'B2'], 'min': 20, 'max': 200, 'gamma': 2.0},
+            'Landsat 7',
+            True,
+        )
+        self.addLayer(dem, vis_params, 'SRTM DEM', True, 1)
+        self.addLayer(states, {}, "US States")
+
+
+@solara.component
+def Page():
+    with solara.Column(style={"min-width": "500px"}):
+        Map.element(
+            center=[40, -100],
+            zoom=4,
+            height="800px",
+        )

pages/03_plotting.py

@@ -0,0 +1,40 @@
+import ee
+import geemap
+
+import solara
+
+
+class Map(geemap.Map):
+    def __init__(self, **kwargs):
+        super().__init__(**kwargs)
+        self.add_ee_data()
+        self.add_plot_gui()
+
+    def add_ee_data(self):
+        landsat7 = ee.Image('LANDSAT/LE7_TOA_5YEAR/1999_2003').select(
+            ['B1', 'B2', 'B3', 'B4', 'B5', 'B7']
+        )
+
+        landsat_vis = {'bands': ['B4', 'B3', 'B2'], 'gamma': 1.4}
+        self.addLayer(landsat7, landsat_vis, "Landsat")
+
+        hyperion = ee.ImageCollection('EO1/HYPERION').filter(
+            ee.Filter.date('2016-01-01', '2017-03-01')
+        )
+
+        hyperion_vis = {
+            'min': 1000.0,
+            'max': 14000.0,
+            'gamma': 2.5,
+        }
+        self.addLayer(hyperion, hyperion_vis, 'Hyperion')
+
+
+@solara.component
+def Page():
+    with solara.Column(style={"min-width": "500px"}):
+        Map.element(
+            center=[40, -100],
+            zoom=4,
+            height="800px",
+        )

pages/04_split_map.py

@@ -0,0 +1,55 @@
+import ee
+import geemap
+
+import solara
+
+
+class Map(geemap.Map):
+    def __init__(self, **kwargs):
+        super().__init__(**kwargs)
+        self.add_ee_data()
+
+    def add_ee_data(self):
+        # Select the eight NLCD epochs after 2000.
+        years = ['2001', '2004', '2006', '2008', '2011', '2013', '2016', '2019']
+
+        # Get an NLCD image by year.
+        def getNLCD(year):
+            # Import the NLCD collection.
+            dataset = ee.ImageCollection('USGS/NLCD_RELEASES/2019_REL/NLCD')
+
+            # Filter the collection by year.
+            nlcd = dataset.filter(ee.Filter.eq('system:index', year)).first()
+
+            # Select the land cover band.
+            landcover = nlcd.select('landcover')
+            return landcover
+
+        ## Create an NLCD image collection for the selected years.
+        collection = ee.ImageCollection(ee.List(years).map(lambda year: getNLCD(year)))
+
+        # Create a list of labels to populate the dropdown list.
+        labels = [f'NLCD {year}' for year in years]
+
+        # Add a split-panel map for visualizing NLCD land cover change.
+        self.ts_inspector(
+            left_ts=collection,
+            right_ts=collection,
+            left_names=labels,
+            right_names=labels,
+        )
+
+        # Add the NLCD legend to the map.
+        self.add_legend(
+            title='NLCD Land Cover Type', builtin_legend='NLCD', height="460px"
+        )
+
+
+@solara.component
+def Page():
+    with solara.Column(style={"min-width": "500px"}):
+        Map.element(
+            center=[40, -100],
+            zoom=4,
+            height="800px",
+        )