如何将 Geojson 几何图形绑定到 Folium 中的 HTML 弹出窗口

Question

嗨，这是我的第一个 post（显然是 newB）- 最终目标是能够单击多边形并从 geojson 文件 (gdf) 生成 poup。

我知道答案很明显，但我就是想不通。

.......

gdf=geopandas.read_file("D:\ALK_gis\Map\Folium\UL.geojson" ) #create data frame

lot=list(gdf["CLOT"]) #create list of data from GDF
proj=list(gdf["Project"])#create list of data from GDF
covid=list(gdf["COVid"])#create list of data from GDF
geom=list(gdf["geometry"])#create list of data from GDF

fg1=folium.FeatureGroup(name="cadastre") #create a feature group for pop up not sure if this is correct

for (lot,po,uid) in zip(lot,proj,covid): #bind instances and ref in HTML
    pg = folium.Html( f'''<!DOCTYPE html>
    <html><head></head> 
    <Body style="background-color:grey;width: 302px">
    <h1 style="color:rgb(236, 77, 77);background-color: oldlace;bottom:0px;padding-bottom:0px;margin-bottom: 0px; margin-top: 5px; margin-left:2px;width: 298px;">Lot Details</h1>
    <table style="margin-left:0px;">
        <tbody>
            <tr><td style= background-color:oldlace;width:100px> <span style= columns:#343434;3434>CovID</span> </td>
                <td style= background-color:oldlace;width:200px> <span style= color:#343434> {uid}</span> </tr> 
            <tr><td style= background-color:oldlace;width:100px> <span style= columns:#343434;3434>Lot#</span> </td>
                <td style= background-color:oldlace;width:200px> <span style= color:#343434> {lot}</span> </tr>
            <tr><td style= background-color:oldlace;width:100px> <span style= columns:#343434;3434>Project</span> </td>
                <td style= background-color:oldlace;width:200px> <span style= color:#343434> {po}</span> </tr> 
        </tbody>
    </table></Body>''', script=True) 

    pup1=folium.Popup(pg, max_width=2650)
    #not sure if marker is the way to go here
    # fg1.add_child(folium.Marker.(location=gdf["geometry"],popup=pup1)) 

#or bind it some how here 
folium.GeoJson(data=gdf["geometry"]).add_child(pup1).add_to(m)


m.save("Folium/folium.html")

我已经对 HTML 进行了排序，并且正在弹出地图上的 ID，但没有填充数据。我需要将数据绑定到几何图形（以蓝色标注）。

folium HTML popup

Answer 1

我的解决方案：

gdf=gp.read_file("D:\ALK_gis\Map\Folium\1UL.shp") #create data frame

gdf_temp=gmc=folium.GeoJson(data=gdf)

fg1=folium.FeatureGroup(name="cadastre")

for feature in gdf_temp.data['features']:
    gmc=folium.GeoJson(feature)
    v1=feature["properties"]['Project']
    v2=feature["properties"]['COVid']
    v3=feature["properties"]['Area']
    pg = folium.Html( f'''<!DOCTYPE html><html><head></head> <Body style="background-color:grey;width: 302px">
 <h1 style="color:rgb(236, 77, 77);background-color: oldlace;bottom:0px;padding-bottom:0px;margin-bottom: 0px; margin-top: 5px; margin-left:2px;width: 298px;">Lot Details</h1>
 <table style="margin-left:0px;">
    <tbody>
         <tr><td style= background-color:oldlace;width:100px> <span style= columns:#343434;3434>Project:</span> </td>
            <td style= background-color:oldlace;width:200px> <span style= color:#343434> {v1}</span> </tr>
         <tr><td style= background-color:oldlace;width:100px> <span style= columns:#343434;3434>CovID:</span> </td>
            <td style= background-color:oldlace;width:200px> <span style= color:#343434> {v2}</span> </tr> 
         <tr><td style= background-color:oldlace;width:100px> <span style= columns:#343434;3434>Area:</span> </td>
            <td style= background-color:oldlace;width:200px> <span style= color:#343434> {v3}</span> </tr>
    </tbody></table></Body>''', script=True) #create HTML
    pup1=folium.Popup(html=pg).add_to(gmc)
    gmc.add_to(fg1)

m.add_child(fg1)

folium.LayerControl().add_to(m)

m.save(outfile="folium.html")

如何将 Geojson 几何图形绑定到 Folium 中的 HTML 弹出窗口

how do I bind Geojson Geometries to HTML popup in Folium

html

data-binding

popup

geojson

folium