用Django返回GeoJson

Question

我试图返回一组坐标来绘制地图上的点/矩形.目前我正在使用Polymaps,但我正在考虑转向openlayers,这个例子对于像我这样的javascript新手来说更清晰.

我想发送一个坐标列表加上每个坐标的特定值.而且我也在寻找在同一个json中发送许多坐标列表,每个坐标都有另一个特定值(时间),所以我可以在地图上每次表示不同的点/多边形.

我已经能够用json返回3个单独的列表,一个用于纬度,一个用于经度,另一个用于每个点的值.但是openlayers和Polymaps都在他们的例子中使用GeoJson,这看起来更聪明.

问题是,我不知道用Django生成geoJson响应.我找到了django-geojson,但没有一个明确的例子可以做我想要的,当然也不会在不同的时间返回很多套.

有帮助吗？我也可以接受如何用Json做到这一点.

我现在拥有的:

#views.py

from django.shortcuts import render_to_response
from django.template import RequestContext
import myproject.databasework as databaseWork
import json

def values(request):
    gpsTime = 1043366400
    pls = databaseWork.getValues(gpsTime)
    latitudes = []
    longitudes = []
    values = []

    for row in pls:
        pointId = row[0]
        value = row[2]
        lat, lon = databaseWork.getCoords(pointId)
        latitudes.append(lat)
        longitudes.append(lon)
        values.append(value)

    jsonObject = {'latitudeList': json.dumps(latitudes),
                  'longitudeList': json.dumps(longitudes),
                  'valuesList': json.dumps(values)}
    return render_to_response('mytemplate.html', jsonObject, context_instance=RequestContext(request))

这是html的一部分:

<script type="text/javascript">
        var po = org.polymaps;
        var map = po.map()
            .container(document.getElementById("map").appendChild(po.svg("svg")))
            .add(po.interact())
            .center({lat: 46, lon: 10})
            .zoom(4);   

        var svg = document.querySelector("svg.map");
        svg.setAttribute("width", "100%");
        svg.setAttribute("height", "100%");
        map.resize();

        map.add(po.image()
            .url(po.url("http://{S}tile.cloudmade.com"
            + "/1a1b06b230af4efdbb989ea99e9841af" // http://cloudmade.com/register
            + "/20760/256/{Z}/{X}/{Y}.png")
            .hosts(["a.", "b.", "c.", ""])));



        // Get values from django response
        var latitude = "{{ latitudeList }}";
        var longitude = "{{ longitudeList }}";
        var vpl = "{{ vplList }}";

        // Draw circles
        // Don't know how to do it with Polymaps yet. Example at http://polymaps.org/ex/cluster.html

   </script>

Answer 1

首先看一下geojson规范.这应该非常清楚如何设计数据结构.

但是你的方法有几个问题,基本上是编码错误.看看你的render_to_response方法.你传递了jsonObject一个dict 变量.在您的模板您尝试将变量分配latitudeList这实际上是key的jsonObject.

下面是我如何创建一个geojson对象来显示带有传单的一些点几何的示例(一个值得为您检查的库).

lati = Vsoil.objects.values_list('latitude',flat=True)
longi = Vsoil.objects.values_list('longitude',flat=True)
ids = Vsoil.objects.values_list('id',flat=True)

geo_json = [ {"type": "Feature",
                    "properties": {
                        "id":  ident,
                        "popupContent":  "id=%s" % (ident,) 
                        },
                    "geometry": {
                        "type": "Point",
                        "coordinates": [lon,lat] }}
                    for ident,lon,lat in zip(ids,longi,lati) ] 


return render_to_response('map.html',
                          {'geo_json': geo_json},
                          context_instance=RequestContext(request))

在模板中,您可以简单地将对象分配给这样的js变量

var geojsonFeature = {{ geo_json|safe }}