如何在geodjango中使用OpenStreetMap的openlayers显示数据?

mon*_*kut 12 python mapping geodjango openlayers

我已经使用openlayersOpenStreetMaps运行管理应用程序运行geodjango .

现在我想写一些视图来显示数据.基本上,我只想在地图中添加一个点列表(在管理员中看到).

Geodjango似乎使用了一个特殊的 openlayers.js文件来管理它.有没有一种很好的方式与此接口?

如何编写视图/模板以在打开的街道地图窗口中显示geodjango数据,如管理员所示?

目前,我正在挖掘openlayers.js文件和api寻找一个"简单"的解决方案.(我没有经验,所以这需要一些时间.)

我可以看到的当前方式是将以下内容添加为模板,并使用django添加显示点所需的代码.(根据这里的例子)

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Draw Feature Example</title>

        <script src="http://www.openlayers.org/api/OpenLayers.js"></script>
      <script type="text/javascript">
            var map;

            function init(){
                map = new OpenLayers.Map('map');
                var layer = new OpenLayers.Layer.WMS( "OpenLayers WMS",
                        "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );
                map.addLayer(layer);

                /*
                 * Layer style
                 */
                // we want opaque external graphics and non-opaque internal graphics
                var layer_style = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']);
                layer_style.fillOpacity = 0.2;
                layer_style.graphicOpacity = 1;

                /*
                 * Blue style
                 */
                var style_blue = OpenLayers.Util.extend({}, layer_style);
                style_blue.strokeColor = "blue";
                style_blue.fillColor = "blue";
                style_blue.graphicName = "star";
                style_blue.pointRadius = 10;
                style_blue.strokeWidth = 3;
                style_blue.rotation = 45;
                style_blue.strokeLinecap = "butt";

                var vectorLayer = new OpenLayers.Layer.Vector("Simple Geometry", {style: layer_style});

                // create a point feature
                var point = new OpenLayers.Geometry.Point(-111.04, 45.68);
                var pointFeature = new OpenLayers.Feature.Vector(point,null,style_blue);
                // Add additional points/features here via django

                map.addLayer(vectorLayer);
                map.setCenter(new OpenLayers.LonLat(point.x, point.y), 5);
                vectorLayer.addFeatures([pointFeature]);
            }
        </script>
    </head>
    <body onload="init()">
        <div id="map" class="smallmap"></div>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

它是如何完成的,还是有更好的方法?

小智 5

另一种解决方案是创建一个使用 GeoDjango Admin 小部件的表单。

为此,我:

设置一个 GeneratePolygonAdminClass:

class GeneratePolygonAdmin(admin.GeoModelAdmin):
    list_filter=('polygon',)
    list_display=('object', 'polygon')
Run Code Online (Sandbox Code Playgroud)

在哪里构建表单:

geoAdmin=GeneratePolygonAdmin(ModelWithPolygonField, admin.site)
PolygonFormField=GeneratePolygon._meta.get_field('Polygon')
PolygonWidget=geoAdmin.get_map_widget(PolygonFormField)
Dict['Polygon']=forms.CharField(widget=PolygonWidget())  #In this case, I am creating a Dict to use for a dynamic form
Run Code Online (Sandbox Code Playgroud)

填充表单的小部件:

def SetupPolygonWidget(form, LayerName, MapFileName, DefaultPolygon=''):
    form.setData({'Polygon':DefaultPolygon})
    form.fields['Polygon'].widget.params['wms_layer']=LayerName
    form.fields['Polygon'].widget.params['wms_url']='/cgi-bin/mapserv?MAP=' + MapFileName
    form.fields['Polygon'].widget.params['default_lon']=-80.9
    form.fields['Polygon'].widget.params['default_lat']=33.7
    form.fields['Polygon'].widget.params['default_zoom']=11
    form.fields['Polygon'].widget.params['wms_name']=YOURWMSLayerName
    form.fields['Polygon'].widget.params['map_width']=800
    form.fields['Polygon'].widget.params['map_height']=600
    form.fields['Polygon'].widget.params['map_srid']=YOUR_SRID
    form.fields['Polygon'].widget.params['modifiable']=True
    form.fields['Polygon'].widget.params['map_options']={}
    form.fields['Polygon'].widget.params['map_options']['buffer'] = 0   
    return form
Run Code Online (Sandbox Code Playgroud)

基于以下代码:http : //code.djangoproject.com/browser/django/branches/gis/django/contrib/gis/admin/options.py?rev=7980

看起来您可以使用 extra_js 选项来包含 OpenStreetMap (我尚未对此进行测试)。


Joe*_*way 2

我认为您的解决方案是可行的,并且可能是最简单的方法。只需模板化 javascript 并使用 Django 在呈现模板时注入数据点即可。

如果您想要更高级,您可以使用 Django 视图,以 JSON (application/json) 形式提供数据点,然后使用 AJAX 根据浏览器中发生的事件回调和检索数据。如果您希望您的应用程序具有高于 OpenLayers 提供的高度交互性,那么增加复杂性可能是值得的,但当然这一切都取决于您的应用程序的需求。