ials/earth

1{2 "cells": [3  {4   "cell_type": "markdown",5   "metadata": {},6   "source": [7    "[![Open In Colab](https://colab.research.google.com/assets/colab-badge.svg)](https://colab.research.google.com/github/opengeos/solara-geemap/blob/main/notebooks/01_basic.ipynb)"8   ]9  },10  {11   "cell_type": "code",12   "execution_count": null,13   "metadata": {},14   "outputs": [],15   "source": [16    "# %pip install -U geemap solara"17   ]18  },19  {20   "cell_type": "code",21   "execution_count": null,22   "metadata": {},23   "outputs": [],24   "source": [25    "import geemap\n",26    "import solara\n",27    "\n",28    "zoom = solara.reactive(4)\n",29    "center = solara.reactive((40, -100))\n",30    "bounds = solara.reactive(None)\n",31    "\n",32    "\n",33    "@solara.component\n",34    "def Page():\n",35    "    # Isolation is required to prevent the map from overlapping navigation (when screen width < 960px)\n",36    "    with solara.Column(\n",37    "        style={\"min-width\": \"500px\", \"height\": \"780px\", \"isolation\": \"isolate\"}\n",38    "    ):\n",39    "        # solara components support reactive variables\n",40    "        solara.SliderInt(label=\"Zoom level\", value=zoom, min=1, max=20)\n",41    "        # using 3rd party widget library require wiring up the events manually\n",42    "        # using zoom.value and zoom.set\n",43    "        geemap.Map.element(  # type: ignore\n",44    "            zoom=zoom.value,\n",45    "            on_zoom=zoom.set,\n",46    "            center=center.value,\n",47    "            on_center=center.set,\n",48    "            on_bounds=bounds.set,\n",49    "            scroll_wheel_zoom=True,\n",50    "            height=\"600px\",\n",51    "        )\n",52    "        solara.Text(f\"Zoom: {zoom.value}\")\n",53    "        solara.Text(f\"Center: {center.value}\")\n",54    "        solara.Text(f\"Bounds: {bounds.value}\")"55   ]56  },57  {58   "cell_type": "code",59   "execution_count": null,60   "metadata": {},61   "outputs": [],62   "source": [63    "Page()"64   ]65  }66 ],67 "metadata": {68  "kernelspec": {69   "display_name": "geo",70   "language": "python",71   "name": "python3"72  },73  "language_info": {74   "codemirror_mode": {75    "name": "ipython",76    "version": 377   },78   "file_extension": ".py",79   "mimetype": "text/x-python",80   "name": "python",81   "nbconvert_exporter": "python",82   "pygments_lexer": "ipython3",83   "version": "3.11.8"84  }85 },86 "nbformat": 4,87 "nbformat_minor": 288}89