{
 "cells": [
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "from ipyleaflet import Map, VectorTileLayer, TileLayer"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "from traitlets import Unicode, Dict\n",
    "\n",
    "# This is a custom VectorTileLayer subclass, allowing to pass our api key to the url\n",
    "class CustomVectorTileLayer(VectorTileLayer):\n",
    "    api_key = Unicode('gCZXZglvRQa6sB2z7JzL1w').tag(sync=True, o=True)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "water_style = dict(\n",
    "    fill=\"true\",\n",
    "    weight=1,\n",
    "    fillColor=\"#06cccc\",\n",
    "    color=\"#06cccc\",\n",
    "    fillOpacity=0.2,\n",
    "    opacity=0.4,\n",
    ")\n",
    "\n",
    "waterway_style = dict(\n",
    "    weight=1, fillColor=\"#2375e0\", color=\"#2375e0\", fillOpacity=0.2, opacity=0.4\n",
    ")\n",
    "\n",
    "admin_style = dict(\n",
    "    weight=1, fillColor=\"pink\", color=\"pink\", fillOpacity=0.2, opacity=0.4\n",
    ")\n",
    "\n",
    "landcover_style = dict(\n",
    "    fill=\"true\",\n",
    "    weight=1,\n",
    "    fillColor=\"#53e033\",\n",
    "    color=\"#53e033\",\n",
    "    fillOpacity=0.2,\n",
    "    opacity=0.4,\n",
    ")\n",
    "\n",
    "landuse_style = dict(\n",
    "    fill=\"true\",\n",
    "    weight=1,\n",
    "    fillColor=\"#e5b404\",\n",
    "    color=\"#e5b404\",\n",
    "    fillOpacity=0.2,\n",
    "    opacity=0.4,\n",
    ")\n",
    "\n",
    "park_style = dict(\n",
    "    fill=\"true\",\n",
    "    weight=1,\n",
    "    fillColor=\"#84ea5b\",\n",
    "    color=\"#84ea5b\",\n",
    "    fillOpacity=0.2,\n",
    "    opacity=0.4,\n",
    ")\n",
    "\n",
    "boundary_style = dict(\n",
    "    weight=1, fillColor=\"#c545d3\", color=\"#c545d3\", fillOpacity=0.2, opacity=0.4\n",
    ")\n",
    "\n",
    "\n",
    "aeroway = dict(\n",
    "    weight=1, fillColor=\"#51aeb5\", color=\"#51aeb5\", fillOpacity=0.2, opacity=0.4\n",
    ")\n",
    "\n",
    "road = dict(\n",
    "    weight=1, fillColor=\"#f2b648\", color=\"#f2b648\", fillOpacity=0.2, opacity=0.4\n",
    ")\n",
    "\n",
    "transit = dict(\n",
    "    weight=0.5, fillColor=\"#f2b648\", color=\"#f2b648\", fillOpacity=0.2, opacity=0.4\n",
    ")\n",
    "\n",
    "buildings = dict(\n",
    "    fill=\"true\",\n",
    "    weight=1,\n",
    "    fillColor=\"#2b2b2b\",\n",
    "    color=\"#2b2b2b\",\n",
    "    fillOpacity=0.2,\n",
    "    opacity=0.4,\n",
    ")\n",
    "\n",
    "water_name = dict(\n",
    "    weight=1, fillColor=\"#022c5b\", color=\"#022c5b\", fillOpacity=0.2, opacity=0.4\n",
    ")\n",
    "\n",
    "transportation_name = dict(\n",
    "    weight=1, fillColor=\"#bc6b38\", color=\"#bc6b38\", fillOpacity=0.2, opacity=0.4\n",
    ")\n",
    "\n",
    "place = dict(\n",
    "    weight=1, fillColor=\"#f20e93\", color=\"#f20e93\", fillOpacity=0.2, opacity=0.4\n",
    ")\n",
    "\n",
    "housenumber = dict(\n",
    "    weight=1, fillColor=\"#ef4c8b\", color=\"#ef4c8b\", fillOpacity=0.2, opacity=0.4\n",
    ")\n",
    "\n",
    "poi = dict(weight=1, fillColor=\"#3bb50a\", color=\"#3bb50a\", fillOpacity=0.2, opacity=0.4)\n",
    "\n",
    "earth = dict(\n",
    "    fill=\"true\",\n",
    "    weight=1,\n",
    "    fillColor=\"#c0c0c0\",\n",
    "    color=\"#c0c0c0\",\n",
    "    fillOpacity=0.2,\n",
    "    opacity=0.4,\n",
    ")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "url = 'https://tile.nextzen.org/tilezen/vector/v1/512/all/{z}/{x}/{y}.mvt?api_key={apiKey}'\n",
    "vector_tile_layer_styles = dict(\n",
    "    water=water_style,\n",
    "    waterway=waterway_style,\n",
    "    admin=admin_style,\n",
    "    andcover=landcover_style,\n",
    "    landuse=landuse_style,\n",
    "    park=park_style,\n",
    "    boundaries=boundary_style,\n",
    "    aeroway=aeroway,\n",
    "    roads=road,\n",
    "    transit=transit,\n",
    "    buildings=buildings,\n",
    "    water_name=water_name,\n",
    "    transportation_name=transportation_name,\n",
    "    places=place,\n",
    "    housenumber=housenumber,\n",
    "    pois=poi,\n",
    "    earth=earth\n",
    ")\n",
    "\n",
    "m = Map(center=(52.204793, 360.121558), zoom=9)\n",
    "vl = CustomVectorTileLayer(url=url, vector_tile_layer_styles=vector_tile_layer_styles)\n",
    "m.add_layer(vl)\n",
    "m"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "m.zoom = 3.58"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "vl.url = \"https://basemaps.arcgis.com/v1/arcgis/rest/services/World_Basemap/VectorTileServer/tile/{z}/{y}/{x}.pbf\""
   ]
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.8.2"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 4
}