From b78a26612db3bd849b32938a14801349ed4dc4a3 Mon Sep 17 00:00:00 2001 From: Stefan Kuethe Date: Wed, 24 Jan 2024 11:48:39 +0100 Subject: [PATCH] Make prop optional --- docs/examples/geopandas/app.py | 5 +++-- maplibre/map.py | 8 ++++---- maplibre/srcjs/index.js | 2 +- srcjs/pymaplibregl.js | 3 ++- 4 files changed, 10 insertions(+), 8 deletions(-) diff --git a/docs/examples/geopandas/app.py b/docs/examples/geopandas/app.py index c53d0e36..2d01af49 100644 --- a/docs/examples/geopandas/app.py +++ b/docs/examples/geopandas/app.py @@ -29,8 +29,9 @@ def create_map(): m = Map(map_options) m.add_layer(wilderness_layer) - # m.add_tooltip(LAYER_ID, "NAME") - m.add_tooltip(LAYER_ID, None) + m.add_tooltip(LAYER_ID, "NAME") + # m.add_tooltip(LAYER_ID) + # m.add_popup(LAYER_ID, "NAME") return m diff --git a/maplibre/map.py b/maplibre/map.py index ede455fb..96aa35d0 100644 --- a/maplibre/map.py +++ b/maplibre/map.py @@ -158,21 +158,21 @@ def add_marker(self, marker: Marker) -> None: """ self.add_call("addMarker", marker.to_dict()) - def add_popup(self, layer_id: str, prop: str) -> None: + def add_popup(self, layer_id: str, prop: str = None) -> None: """Add a popup to the map Args: layer_id (str): The layer to which the popup is added. - prop (str): The property of the source to be displayed. + prop (str): The property of the source to be displayed. If `None`, all properties will be displayed. """ self.add_call("addPopup", layer_id, prop) - def add_tooltip(self, layer_id: str, prop: str) -> None: + def add_tooltip(self, layer_id: str, prop: str = None) -> None: """Add a tooltip to the map Args: layer_id (str): The layer to which the tooltip is added. - prop (str): The property of the source to be displayed. + prop (str): The property of the source to be displayed. If `None`, all properties will be displayed. """ self.add_call("addTooltip", layer_id, prop) diff --git a/maplibre/srcjs/index.js b/maplibre/srcjs/index.js index 3d17d077..d86dea7f 100644 --- a/maplibre/srcjs/index.js +++ b/maplibre/srcjs/index.js @@ -1 +1 @@ -(()=>{function c(i,e){return e===null?Object.keys(i.properties).map(o=>`${o}: ${i.properties[o]}`).join("
"):i.properties[e]}var p=class{constructor(e){this._id=e.container,this._map=new maplibregl.Map(e),this._map.on("mouseover",()=>{this._map.getCanvas().style.cursor="pointer"}),this._map.on("mouseout",()=>{this._map.getCanvas().style.cursor=""}),this._map.addControl(new maplibregl.NavigationControl)}getMap(){return this._map}applyMapMethod(e,t){this._map[e](...t)}addControl(e,t,o){this._map.addControl(new maplibregl[e](t),o)}addMarker({lngLat:e,popup:t,options:o}){let n=new maplibregl.Marker(o).setLngLat(e);if(t){let a=new maplibregl.Popup(t.options).setHTML(t.text);n.setPopup(a)}n.addTo(this._map)}addLayer(e){this._map.addLayer(e),typeof Shiny<"u"&&this._map.on("click",e.id,t=>{console.log(t,t.features[0]);let o=e.id.replaceAll("-","_"),n=`${this._id}_layer_${o}`,a={props:t.features[0].properties,layer_id:e.id};console.log(n,a),Shiny.onInputChange(n,a)})}addPopup(e,t){let o={closeButton:!1},n=new maplibregl.Popup(o);this._map.on("click",e,a=>{let s=a.features[0].properties[t];n.setLngLat(a.lngLat).setHTML(s).addTo(this._map)})}addTooltip(e,t){let o={closeButton:!1,closeOnClick:!1},n=new maplibregl.Popup(o);this._map.on("mousemove",e,a=>{let r=a.features[0],s=c(r,t);n.setLngLat(a.lngLat).setHTML(s).addTo(this._map)}),this._map.on("mouseleave",e,()=>{n.remove()})}setSourceData(e,t){this._map.getSource(e).setData(t)}render(e){e.forEach(([t,o])=>{if(["addLayer","addPopup","addTooltip","addMarker","addPopup","addControl","setSourceData"].includes(t)){console.log("Custom method",t,o),this[t](...o);return}console.log("Map method",t),this.applyMapMethod(t,o)})}};var u="0.1.0";console.log("pymaplibregl",u);typeof Shiny>"u"&&(window.pymaplibregl=function({mapOptions:i,calls:e}){let t="pymaplibregl",o=document.getElementById(t),n=new p(Object.assign({container:o.id},i));n.getMap().on("load",()=>{n.render(e)})});if(typeof Shiny<"u"){class i extends Shiny.OutputBinding{find(t){return t.find(".shiny-maplibregl-output")}renderValue(t,o){console.log("id:",t.id,"payload:",o);let n=new p(Object.assign({container:t.id},o.mapData.mapOptions)),a=n.getMap();a.on("load",()=>{n.render(o.mapData.calls)}),a.on("click",s=>{console.log(s);let l=`${t.id}`,d={coords:s.lngLat,point:s.point};console.log(l,d),Shiny.onInputChange(l,d)});let r=`pymaplibregl-${t.id}`;console.log(r),Shiny.addCustomMessageHandler(r,({id:s,calls:l})=>{console.log(s,l),n.render(l)})}}Shiny.outputBindings.register(new i,"shiny-maplibregl-output")}})(); +(()=>{function c(i,e){return e===null?Object.keys(i.properties).map(o=>`${o}: ${i.properties[o]}`).join("
"):i.properties[e]}var r=class{constructor(e){this._id=e.container,this._map=new maplibregl.Map(e),this._map.on("mouseover",()=>{this._map.getCanvas().style.cursor="pointer"}),this._map.on("mouseout",()=>{this._map.getCanvas().style.cursor=""}),this._map.addControl(new maplibregl.NavigationControl)}getMap(){return this._map}applyMapMethod(e,t){this._map[e](...t)}addControl(e,t,o){this._map.addControl(new maplibregl[e](t),o)}addMarker({lngLat:e,popup:t,options:o}){let n=new maplibregl.Marker(o).setLngLat(e);if(t){let a=new maplibregl.Popup(t.options).setHTML(t.text);n.setPopup(a)}n.addTo(this._map)}addLayer(e){this._map.addLayer(e),typeof Shiny<"u"&&this._map.on("click",e.id,t=>{console.log(t,t.features[0]);let o=e.id.replaceAll("-","_"),n=`${this._id}_layer_${o}`,a={props:t.features[0].properties,layer_id:e.id};console.log(n,a),Shiny.onInputChange(n,a)})}addPopup(e,t){let o={closeButton:!1},n=new maplibregl.Popup(o);this._map.on("click",e,a=>{let p=a.features[0],s=c(p,t);n.setLngLat(a.lngLat).setHTML(s).addTo(this._map)})}addTooltip(e,t){let o={closeButton:!1,closeOnClick:!1},n=new maplibregl.Popup(o);this._map.on("mousemove",e,a=>{let p=a.features[0],s=c(p,t);n.setLngLat(a.lngLat).setHTML(s).addTo(this._map)}),this._map.on("mouseleave",e,()=>{n.remove()})}setSourceData(e,t){this._map.getSource(e).setData(t)}render(e){e.forEach(([t,o])=>{if(["addLayer","addPopup","addTooltip","addMarker","addPopup","addControl","setSourceData"].includes(t)){console.log("Custom method",t,o),this[t](...o);return}console.log("Map method",t),this.applyMapMethod(t,o)})}};var u="0.1.0";console.log("pymaplibregl",u);typeof Shiny>"u"&&(window.pymaplibregl=function({mapOptions:i,calls:e}){let t="pymaplibregl",o=document.getElementById(t),n=new r(Object.assign({container:o.id},i));n.getMap().on("load",()=>{n.render(e)})});if(typeof Shiny<"u"){class i extends Shiny.OutputBinding{find(t){return t.find(".shiny-maplibregl-output")}renderValue(t,o){console.log("id:",t.id,"payload:",o);let n=new r(Object.assign({container:t.id},o.mapData.mapOptions)),a=n.getMap();a.on("load",()=>{n.render(o.mapData.calls)}),a.on("click",s=>{console.log(s);let l=`${t.id}`,d={coords:s.lngLat,point:s.point};console.log(l,d),Shiny.onInputChange(l,d)});let p=`pymaplibregl-${t.id}`;console.log(p),Shiny.addCustomMessageHandler(p,({id:s,calls:l})=>{console.log(s,l),n.render(l)})}}Shiny.outputBindings.register(new i,"shiny-maplibregl-output")}})(); diff --git a/srcjs/pymaplibregl.js b/srcjs/pymaplibregl.js index 7e8ea22d..ecc1bf39 100644 --- a/srcjs/pymaplibregl.js +++ b/srcjs/pymaplibregl.js @@ -77,7 +77,8 @@ export default class PyMapLibreGL { const popup = new maplibregl.Popup(popupOptions); this._map.on("click", layerId, (e) => { const feature = e.features[0]; - const text = feature.properties[property]; + // const text = feature.properties[property]; + const text = getTextFromFeature(feature, property); popup.setLngLat(e.lngLat).setHTML(text).addTo(this._map); }); }