{ "cells": [ { "cell_type": "code", "execution_count": null, "metadata": {}, "outputs": [], "source": [ "import param\n", "import pandas as pd\n", "import panel as pn\n", "import numpy as np\n", "\n", "from panel.reactive import ReactiveHTML\n", "\n", "CSS = ['https://unpkg.com/leaflet@1.7.1/dist/leaflet.css']\n", "\n", "JS = {\n", " 'leaflet': 'https://unpkg.com/leaflet@1.7.1/dist/leaflet.js',\n", " 'heat': 'https://cdn.jsdelivr.net/npm/leaflet.heat@0.2.0/dist/leaflet-heat.min.js'\n", "}\n", "\n", "pn.extension(css_files=CSS, js_files=JS)" ] }, { "cell_type": "code", "execution_count": null, "metadata": {}, "outputs": [], "source": [ "class LeafletHeatMap(ReactiveHTML):\n", " \n", " attribution = param.String(doc=\"Tile source attribution.\")\n", " \n", " blur = param.Integer(default=18, bounds=(5, 50), doc=\"Amount of blur to apply to heatmap\")\n", " \n", " center = param.XYCoordinates(default=(0, 0), doc=\"The center of the map.\")\n", " \n", " data = param.DataFrame(doc=\"The heatmap data to plot, should have 'x', 'y' and 'value' columns.\")\n", " \n", " tile_url = param.String(doc=\"Tile source URL with {x}, {y} and {z} parameter\")\n", " \n", " min_alpha = param.Number(default=0.2, bounds=(0, 1), doc=\"Minimum alpha of the heatmap\")\n", " \n", " radius = param.Integer(default=25, bounds=(5, 50), doc=\"The radius of heatmap values on the map\")\n", " \n", " x = param.String(default='longitude', doc=\"Column in the data with longitude coordinates\")\n", " \n", " y = param.String(default='latitude', doc=\"Column in the data with latitude coordinates\")\n", " \n", " value = param.String(doc=\"Column in the data with the data values\")\n", " \n", " zoom = param.Integer(default=13, bounds=(0, 21), doc=\"The plots zoom-level\")\n", "\n", " _template = \"\"\"\n", "
\n", " \"\"\"\n", " \n", " _scripts = {\n", " 'get_data': \"\"\"\n", " const records = []\n", " for (let i=0; i