{
 "cells": [
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "import folium\n",
    "import panel as pn\n",
    "\n",
    "pn.extension(sizing_mode=\"stretch_width\")"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "The ``Folium`` pane renders [folium](http://python-visualization.github.io/folium/) interactive maps.\n",
    "\n",
    "#### Parameters:\n",
    "\n",
    "For details on other options for customizing the component see the [layout](../../how_to/layout/index.md) and [styling](../../how_to/styling/index.md) how-to guides.\n",
    "\n",
    "* **``object``** (object): The Folium object being displayed\n",
    "___"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "The `Folium` pane uses the built-in HTML representation provided by `folium` to render the map:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "m = folium.Map(location=[52.51, 13.39], zoom_start=12)\n",
    "\n",
    "folium_pane = pn.pane.plot.Folium(m, height=400)\n",
    "\n",
    "folium_pane"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Like any other pane, the `Folium` pane's view can be updated by setting the `object` parameter:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "# Add a marker to the map\n",
    "folium.Marker(\n",
    "    [52.516, 13.381], popup=\"<i>Brandenburg Gate</i>\", tooltip=\"Click me!\"\n",
    ").add_to(m)\n",
    "\n",
    "folium_pane.object = m"
   ]
  }
 ],
 "metadata": {
  "language_info": {
   "name": "python",
   "pygments_lexer": "ipython3"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 4
}
