1

我正在 django 中开发一个网站，我需要为此显示美国各州的地图。我有一个返回地图 JSON 规范的 URL（使用 vincent - http://wrobstory.github.io/2013/04/python-maps-choropleth.html生成）和一个返回 us_states.topo.json 的 URL由 vega 运行时 ( https://github.com/trifacta/vega/wiki/Runtime ) 用来渲染地图。两个 URL 都来自同一个 DJango 服务器，并且似乎工作正常。以下是网址（为便于理解）：

<code>
JSON spec for map : http://localhost:8000/lydia2/Obama/20140211-20140410/heatmap.json
us_states.topo.json : http://localhost:8000/lydia2/us_states.topo.json
</code>

以下是模板：

<html>
<head>
    <title>
       TextMap2: The Multilingual Entity Search Engine
    </title>
    <script src="http://trifacta.github.io/vega/lib/d3.v3.min.js"></script>
    <script src="http://trifacta.github.io/vega/lib/d3.geo.projection.min.js"></script>
    <script src="http://trifacta.github.io/vega/lib/topojson.js"></script>
    <script src="http://trifacta.github.io/vega/vega.js"></script>
    <script type="text/javascript">
        // parse a spec and create a visualization view
        function parse(spec) {
            document.write(spec);
            vg.parse.spec(spec, function(chart) { chart({el:"#vis"}).update(); });
        }
        //parse('Obama/20140211-20140410/heatmap.json')
    </script>
</head>
<body>
    <div align='center'>
        <form action="{% url 'lydia2:analytics' %}" method="post">
            {% csrf_token %}
            Entity: <input type="text" name="entity" id="entity" {% if entity %} value="{{entity}}"{% endif %}/>
            Start Date: <input type="text" name="start_date" id="start_date" {% if start_date %} value="{{start_date}}"{% endif %}/>
            End Date: <input type="text" name="end_date" id="end_date" {% if end_date %} value="{{end_date}}" {% endif %}/>
            <input type = "submit" value="Search" />
        </form>
    </div>
    <div align='center'>
        {% if entity %}<p><h2>{{entity}}</h2></p>{% endif %}
        {% if search_result %}<p><strong>{{ search_result }}</strong></p>{% endif %}
        {% if entity and start_date and end_date %}
        <p>
            <image src="{% url 'lydia2:frequency' entity start_date end_date %}" />               
        </p>
        <p>
            <div id="vis"></div>
            <img src="simple-pattern.jpg" onload="parse('Obama/20140211-20140410/heatmap.json');this.parentNode.removeChild(this);" />
        </p>
        {% endif %}
    </div>
</body>

根据服务器日志，确实调用了“parse”函数（两个 URL 都有 GET 调用），但是地图的图像没有被渲染。

我在这里错过了什么吗？

PS：我在不同的 SimpleHttpServer 上单独尝试了这个 javascript，它可以工作！

4

0 回答 0