0

我已经用一个简单的表单设置了一个 Flask 服务器。我想添加一张地图，以便用户可以按地区选择。我找到了 JQVMap并一直试图让这个例子与 Flask 一起工作。

我下载了 dist 目录。
把它放在我的静态 Flask 目录中。
并使用了下面的代码。

使用此 html 进行参考导入：

<link href="{{ url_for('static', filename='dist/jqvmap.css') }}" media="screen" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

<script type="text/javascript" src="{{ url_for('static', filename='dist/jquery.vmap.js') }}"></script>

<script type="text/javascript" src="{{ url_for('static', filename='dist/maps/jquery.vmap.usa.counties.js') }}"
    charset="utf-8"></script>

<script type="text/javascript">
    jQuery(document).ready(function () {
        jQuery('#vmap').vectorMap({
            map: 'usa_counties_en',
            enableZoom: true,
            showTooltip: true,
            hoverColor: '#C9DFAF',
            onRegionClick: function (event, code, region) {
                event.preventDefault();
            }
        });
    });
</script>

这是驱动它的python：

@app.route('/map/', methods=['GET', 'POST'])
def mapLoc():
    return render_template('map.html')

连接到该页面会在所有文件提取上为我提供 html 代码 200 或 304。
该网页不呈现任何内容。
控制台抛出错误：
“TypeError: jQuery(...).vectorMap is not a function”

4

1 回答 1

0

我无法重现“TypeError：jQuery(...).vectorMap 不是函数”，也无法重现 200/304 HTTP 响应代码。（确保您在脚本标签中使用了正确的路径？）。但是，由于您的模板不包含这些行，因此不会呈现任何内容

<body>
  <div id="vmap" style="width: 900px; height: 600px;"></div>
</body>

这表明应该在哪里呈现 jqvmap。

于 2019-08-22T23:28:11.170 回答