Update wmts params to match bokeh

[ahuang11]

Closes #509 an old issue of mine :)

Will probably add this to the pythia cookbook once this gets released.
https://projectpythia.org/web-map-feature-services-cookbook/notebooks/web_map_services.html

import asyncio
import geoviews as gv
import panel as pn
from owslib.wms import WebMapService
from urllib.parse import quote

pn.extension()
gv.extension("bokeh")

XMIN = -20037507.539400
YMIN = 1638517.444800
XMAX = 20037260.918700
YMAX = 7714669.394600
XML_URL = "https://opengeo.ncep.noaa.gov/geoserver/conus/conus_cref_qcd/ows?service=wms&version=1.3.0&request=GetCapabilities"

def get_wms_url(wms, layer, **params):
    styles = list(wms[layer].styles)
    wms_url = wms.getmap(
        layers=[layer],
        styles=styles,
        srs="EPSG:3857",
        bbox=(XMIN, YMIN, XMAX, YMAX),
        size=(256, 256),
        format="image/png",
        transparent=True,
        **params
    ).geturl()
    return wms_url

def formulate_url_template(url):
    return (
        url.replace(str(XMIN), "{XMIN}")
        .replace(str(YMIN), "{YMIN}")
        .replace(str(XMAX), "{XMAX}")
        .replace(str(YMAX), "{YMAX}")
        .replace(quote(times[0]), "{time}")
    )

async def update_shadow(event):
    # hack to prevent it from flickering
    for i in range(10):
        await asyncio.sleep(0.1)
        shadow_wms.alpha = 1 - i / 10
    shadow_slider.value = time_slider.value

def display_wms(time):
    return gv.WMTS(wms_url_template).opts(extra_url_vars={"time": time})

wms = WebMapService(XML_URL)
contents = list(wms.contents)
layer = contents[0]
times = wms[layer].timepositions
wms_url = get_wms_url(wms, layer=layer, time=times[0])
wms_url_template = formulate_url_template(wms_url)

# define widgets
time_slider = pn.widgets.DiscreteSlider(options=times, value=times[0], name="Time")
shadow_slider = pn.widgets.DiscreteSlider(options=times, value=times[0], name="Time", visible=False)
pn.bind(update_shadow, time_slider.param.value_throttled, watch=True)

# define maps
wms = gv.DynamicMap(pn.bind(display_wms, time=time_slider.param.value_throttled))
shadow_wms = gv.DynamicMap(pn.bind(display_wms, time=shadow_slider)).opts(global_extent=True)

pn.Column(time_slider, shadow_slider, shadow_wms * wms).show()

Screen.Recording.2024-01-23.at.4.19.51.PM.mov