使用PyScript结合folium库开发时遭遇TypeError问题求助

错误原因 #

你代码里的fpl.map()是错误用法——folium中创建地图实例的是大写开头的Map类，而folium.map是folium库的一个子模块，并非可调用的构造函数，因此触发了'module' object is not callable错误。另外，直接print(m)无法在PyScript中正确渲染folium地图，需要将地图转换为HTML后插入页面DOM。

修正后的代码 #

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script defer src="https://pyscript.net/latest/pyscript.js"></script>
    <link rel="stylesheet" href="https://pyscript.net/latest/pyscript.css" />
   
    <py-env>
        - folium
    </py-env>
   
    <title>pyscript test</title>
    <style>
        #map { width: 100vw; height: 90vh; }
    </style>
</head>
<body>
    <div id="map"></div>

    <py-script>
import folium as fpl
from pyscript import Element

# 使用大写的Map创建地图实例
m = fpl.Map(location=[-6.2238, 106.8193], zoom_start=10)

# 将地图转换为HTML并插入到指定DOM元素中
map_element = Element("map")
map_element.element.innerHTML = m._repr_html_()
    </py-script>
</body>
</html>

关键修正点 #

• 替换fpl.map()为fpl.Map()：这是folium创建地图实例的标准方式，调用的是folium的Map类构造函数。
• 通过pyscript.Element操作DOM：利用folium地图的_repr_html_()方法获取其HTML代码，再插入到页面的map容器中，替代无效的print操作。
• 补充容器样式：给map容器设置明确的宽高，确保地图能正常显示。

内容的提问来源于stack exchange，提问作者Manel