跳转到主要内容

在您的django项目中使用Leaflet

项目描述

django-leaflet 允许您在 LeafletDjango 项目中使用。

它嵌入Leaflet版本 1.0.3

https://img.shields.io/pypi/v/django-leaflet.svg https://img.shields.io/pypi/dm/django-leaflet.svg https://travis-ci.org/makinacorpus/django-leaflet.png https://coveralls.io/repos/makinacorpus/django-leaflet/badge.png

拥有Leaflet JavaScript库的Python包的主要目的

  • 安装并享受;

  • 不要在每个Django项目中嵌入Leaflet资源;

  • 使用Leaflet表单小部件享受几何编辑;

  • 从Django设置中控制地图的显示和设置(例如在部署时);

  • 重用Leaflet地图初始化代码(例如本地投影);

注意:

django-leafletdjango-geojson字段兼容,允许在不使用空间数据库的情况下处理地理数据。

安装

最新稳定版本

pip install django-leaflet

最新开发版本(master分支)

pip install -e git+https://github.com/makinacorpus/django-leaflet.git#egg=django-leaflet

用法

  • leaflet添加到您的INSTALLED_APPS

  • 确保django.contrib.staticfiles也包含在您的INSTALLED_APPS中;Django >= 1.3默认包含此贡献应用

  • 添加HTML头部;

    {% load leaflet_tags %}
    
    <head>
        ...
        {% leaflet_js %}
        {% leaflet_css %}
    </head>
  • 在您的页面中添加地图,提供名称;

    ...
    <body>
        ...
        {% leaflet_map "yourmap" %}
        ...
    </body>
  • 您的地图显示出来!

示例

查看示例项目以获取完整集成!

使用Leaflet API

您可以使用Leaflet API,就像平常一样。有两种方法可以获取初始化后的地图和选项的引用。

使用JavaScript回调函数

简单的方法

<script type="text/javascript">
    function map_init_basic (map, options) {
        ...
        L.marker([50.5, 30.5]).addTo(map);
        ...
    }
</script>

{% leaflet_map "yourmap" callback="window.map_init_basic" %}

使用事件

如果您不想暴露全局回调

<script type="text/javascript">
    window.addEventListener("map:init", function (e) {
        var detail = e.detail;
        ...
        L.marker([50.5, 30.5]).addTo(detail.map);
        ...
    }, false);
</script>

事件对象有两个属性:mapoptions(初始化)。

为了支持Internet Explorer,如果可用,我们将回退到jQuery

$(window).on('map:init', function (e) {
    var detail = e.originalEvent ?
                 e.originalEvent.detail : e.detail;
    ...
    L.marker([50.5, 30.5]).addTo(detail.map);
    ...
});

如果您想支持古老的浏览器并且仍然避免jQuery,django-leaflet提供了一个最小化的polyfill事件。以这种方式将其添加到<head>

<!--[if IE 8]><script src="{% static "leaflet/eventlister.ie8.js" %}"></script><!--<![endif]-->
<!--[if lt IE 8]><script src="{% static "leaflet/eventlister.ie6-7.js" %}"></script><!--<![endif]-->

自定义地图大小

CSS是您的朋友

<style>

    .leaflet-container {  /* all maps */
        width:  600px;
        height: 400px;
    }

    #specialbigmap {
        height: 800px;
    }

</style>

配置

为了配置django-leaflet,只需在您的设置中添加一个新部分

LEAFLET_CONFIG = {
    # conf here
}

然后添加以下条目之一。

空间范围

您可以配置全局空间范围,您的地图将自动居中,限制平移并添加重置视图和比例控件。(请参阅高级用法以调整。

'SPATIAL_EXTENT': (5.0, 44.0, 7.5, 46)

初始地图中心和缩放级别

除了使用SPATIAL_EXTENT限制您的地图外,您还可以指定初始地图中心、默认值、最小和最大缩放级别

'DEFAULT_CENTER': (6.0, 45.0),
'DEFAULT_ZOOM': 16,
'MIN_ZOOM': 3,
'MAX_ZOOM': 18,

元组/列表必须包含(纬度,经度)坐标。

默认瓦片层

为您的地图全局添加瓦片层

'TILES': 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'

此设置也可以是一个元组列表(name, url, options)。python字典options接受所有Leaflet瓦片层选项。

如果包含多个层,则会自动添加图层切换器。

'TILES': [('Satellite', 'http://server/a/...', {'attribution': '&copy; Big eye', 'maxZoom': 16}),
          ('Streets', 'http://server/b/...', {'attribution': '&copy; Contributors'})]

如果您省略此设置,将为您创建一个默认的OpenSTreetMap层,以便您使用。如果您不想有默认层(可能是在地图初始化时在您自己的JavaScript代码中添加),将值设置为空列表,如下所示。

'TILES': []

请注意,这将阻止在设置中定义的任何叠加层显示。

叠加层

要全局添加叠加层,请使用与瓦片相同的语法

'OVERLAYS': [('Cadastral', 'http://server/a/{z}/{x}/{y}.png', {'attribution': '&copy; IGN'})]

目前,设置中的叠加层仅限于瓦片。对于矢量叠加,您必须通过JavaScript添加(请参阅事件)。

归属前缀

要在地图上全局添加归属前缀(可能是空字符串)

'ATTRIBUTION_PREFIX': 'Powered by django-leaflet'

默认值为None,这将保留Leaflet的默认值

比例控制

比例控制可以设置为显示“公制”(m/km)、“英制”(mi/ft)比例线或“两者”。默认为“公制”。

启用公制和英制比例控制

'SCALE': 'both'

禁用比例控制

'SCALE': None

迷你地图控制

在角落显示一个小地图,显示与主地图相同的内容,具有设置的缩放偏移量

'MINIMAP': True

默认情况下,它显示列表中的第一层瓦片。

(更多信息…)

重置视图按钮

默认情况下,一个按钮出现在缩放控件下方,点击后会显示整个地图。要删除此按钮,设置

'RESET_VIEW': False

全局初始化函数和 window.maps

从0.7.0版本开始,leaflet_map模板标记不再在全局范围内注册初始化函数,并且默认不再将地图对象添加到window.maps数组中。要恢复这些功能,请使用

'NO_GLOBALS' = False

强制Leaflet图像路径

如果您正在使用静态文件压缩库,如django_compressor,它可以对javascript文件进行压缩、连接或重命名,这可能会破坏Leaflet确定其安装路径的能力,进而破坏方法L.Icon.Default.imagePath()

要使用Django对其静态文件的自知之明显式地强制此值,请使用

'FORCE_IMAGE_PATH': True

插件

为了简化插件的用法,django-leaflet允许指定一组插件,以后可以从模板标记中通过名称引用

'PLUGINS': {
    'name-of-plugin': {
        'css': ['relative/path/to/stylesheet.css', '/root/path/to/stylesheet.css'],
        'js': 'http://absolute-url.example.com/path/to/script.js',
        'auto-include': True,
    },
    . . .
}

“css”和“js”在指定资源URL方面支持相同的功能

  • 可以是纯字符串或URL列表

  • 每个字符串可以是

    • 绝对URL - 将原样包含; 示例: http://absolute-url.example.com/path/to/script.js

    • 以根目录开始的URL - 将原样包含; 示例: /root/path/to/stylesheet.css

    • 相对URL - 将settings.STATIC_URL作为前缀; 示例: relative/path/to/stylesheet.css将包含为 /static/relative/path/to/stylesheet.css(取决于您的STATIC_URL设置)

现在,使用leaflet_jsleaflet_css标记加载配置的Leaflet插件的CSS和JS资源。

默认情况下,只有将'auto-include'设置为True的插件将被包含。

要包含页面中的特定插件,指定插件名称,以逗号分隔

{% load leaflet_tags %}

<head>
    ...
    {% leaflet_js  plugins="bouncemarker,draw" %}
    {% leaflet_css plugins="bouncemarker,draw" %}
</head>

要包含配置在LEAFLET_CONFIG['PLUGINS']中的所有插件,请使用

{% leaflet_js plugins="ALL" %}
{% leaflet_css plugins="ALL" %}

Leaflet地图表单小部件

Leaflet小部件用于编辑几何字段。它嵌入版本0.4.0Leaflet.draw

https://f.cloud.github.com/assets/546692/1048836/78b6ad94-1094-11e3-86d8-c3e88626a31d.png

在Adminsite

from django.contrib import admin
from leaflet.admin import LeafletGeoAdmin

from .models import WeatherStation


admin.site.register(WeatherStation, LeafletGeoAdmin)

还有用于内联表单的mixin

from django.contrib import admin
from leaflet.admin import LeafletGeoAdminMixin

class PoiLocationInline(LeafletGeoAdminMixin, admin.StackedInline):
    model = PoiLocation

在表单中

Django >= 1.6的情况下

from django import forms

from leaflet.forms.widgets import LeafletWidget


class WeatherStationForm(forms.ModelForm):

    class Meta:
        model = WeatherStation
        fields = ('name', 'geom')
        widgets = {'geom': LeafletWidget()}

在所有Django版本中

from django import forms

from leaflet.forms.fields import PointField


class WeatherStationForm(forms.ModelForm):
    geom = PointField()

    class Meta:
        model = WeatherStation
        fields = ('name', 'geom')

相关模板看起来像这样

{% load leaflet_tags %}
<html>
  <head>
   {% leaflet_js plugins="forms" %}
   {% leaflet_css plugins="forms" %}
  </head>
  <body>
    <h1>Edit {{ object }}</h1>
    <form action="POST">
        {{ form }}
        <input type="submit"/>
    </form>
  </body>
</html>

每个地图字段都会触发一个事件,您可以使用它来添加您的自定义机制

map.on('map:loadfield', function (e) {
    ...
    // Customize map for field
    console.log(e.field, e.fieldid);
    ...
});

如果您需要可重用的小部件地图自定义,首先通过扩展L.GeometryField来覆盖JavaScript字段行为,然后在Django中派生LeafletWidget以指定自定义的geometry_field_class

YourGeometryField = L.GeometryField.extend({
    addTo: function (map) {
        L.GeometryField.prototype.addTo.call(this, map);
        // Customize map for field
        console.log(this);
    },
    // See GeometryField source (static/leaflet/leaflet.forms.js) to override more stuff...
});
class YourMapWidget(LeafletWidget):
    geometry_field_class = 'YourGeometryField'

class YourForm(forms.ModelForm):
    class Meta:
        model = YourModel
        fields = ('name', 'geom')
        widgets = {'geom': YourMapWidget()}

插件

可以在任何地方添加额外的JS/CSS或自动包含forms插件

LEAFLET_CONFIG = {
    'PLUGINS': {
        'forms': {
            'auto-include': True
        }
    }
}

( 它将覆盖默认的最小所需集以进行编辑 )

详细信息

  • 它依赖于全局设置进行地图初始化。

  • 它与本地地图投影一起工作。但是,SRID通过以下方式全局指定:LEAFLET_CONFIG['SRID']

  • 用于字段值反序列化的JavaScript组件是可插拔的。

  • 用于Leaflet.draw行为初始化的JavaScript组件是可插拔的。

高级用法

{% leaflet_map %}标签参数

  • callback:初始化回调的javascript函数名称。 (默认:None)。

  • fitextent:控制地图初始视图是否设置为范围设置。 (默认:True)。将fixextent设置为False将防止视图重置和添加缩放控件。

  • creatediv:控制是否在标签页创建新div。(默认:True)。在HTML文档的头部或底部而不是主体中放置javascript代码很有用。如果使用,别忘了手动创建div。

  • loadevent:一个或多个由空格分隔的窗口事件,触发地图初始化。(默认:load,即所有页面资源加载完成)。如果提供空值,则地图初始化立即进行。如果提供错误的值,则地图永远不会初始化。:)

  • settings_overrides:具有对默认LEAFLET_CONFIG设置的覆盖的地图。(默认:{})。

配置覆盖

可以在LeafletWidget初始化时动态覆盖设置。

from leaflet.forms.widgets import LeafletWidget


class WeatherStationForm(forms.ModelForm):

    class Meta:
        model = WeatherStation
        fields = ('name', 'geom')
        widgets = {'geom': LeafletWidget(attrs={
            'settings_overrides': {
                'DEFAULT_CENTER': (6.0, 45.0),
            }
        })}

要覆盖LeafletGeoAdmin中的设置,请设置适当的属性

class WeatherStationAdminAdmin(LeafletGeoAdmin):
    settings_overrides = {
       'DEFAULT_CENTER': (6.0, 45.0),
    }

投影

可以在LEAFLET_CONFIG中设置地图空间参考。

'SRID': 2154  # See http://spatialreference.org

需要额外的参数来计算比例级别:本地投影中的瓦片范围

'TILES_EXTENT': [924861,6375196,985649,6448688],

有关更多信息,请参阅这个示例

与Leaflet兼容的瓦片缓存配置示例

[scan-portrait]
type=WMSLayer
layers=scan100,scan25
url=http://server/wms?
extension=jpg
tms_type=google
srs=EPSG:2154
bbox=924861,6375196,985649,6448688

[cache]
type=GoogleDisk
expire=2592000
base=/tmp/tiles

默认情况下,django-leaflet会尝试从“proj4js/{{ srid }}.js”中的静态文件加载空间参考。如果失败,它将最终依赖于spatialreference.org

教程

作者

makinacom

LICENSE

  • GNU通用公共许可证

  • Leaflet版权 - 2010-2011 CloudMade, Vladimir Agafonkin

变更日志

0.21.0(未发布)

  • 尚未更改。

0.20.0 (2017-01-27)

新功能

  • 更新Leaflet到1.0.3 (#169)

  • 更新Leaflet-draw到0.4.0 (#169)

  • 更新Proj4Leaflet到1.0.0 (#169)

  • static调用变为懒加载,以解决与非默认STATICFILES_STORAGE的问题 (#149)

  • 添加示例应用程序 (#168)

错误修正

  • 使用环境变量中的SpatiaLite库路径运行测试 (#173)

  • 修复最大缩放级别 (#165)

  • 将SPATIAL_EXTENT默认值添加到默认设置 (#167)

感谢@KostyaEsmukov、@cleder、@sikmir和@seav的贡献!

0.19.0 (2016-08-22)

新功能

  • 添加leaflet.admin.LeafletGeoAdminMixin,对于堆叠或表格内联表单很有用(感谢@KostyaEsmukov、@Xowap)

0.18.2 (2016-08-16)

  • 修复与Django <= 1.7的兼容性

0.18.1 (2016-04-07)

  • 如果TILES设置包含空列表,则不会生成默认瓦片层(感谢@dyve)

  • 修复以允许保存多点(修复#130,感谢@rukayaj)

  • 修复设置覆盖(#142,感谢@ndufrane)

  • 修复templatetags.leflet_js调试设置(#148,感谢@arctelix)

  • 修复Django 1.10兼容性(#138,感谢@PetrDiouhy)

0.18.0 (2016-01-04)

新功能

  • 使用LazyEncoder允许在设置中实现懒翻译(感谢@Mactory)

  • 在管理中启用settings_overrides(修复#120,感谢@PetrDiouhy)

  • 添加Django 1.9和Python 3.5的测试(感谢@itbabu)

错误修正

  • 修复LeafletWidget在GeometryCollectionField上的行为(修复#135)

0.17.1 (2015-12-16)

  • 更新Leaflet到0.7.7

  • 更新Leaflet-draw到0.2.4

  • 修复当初始值为空字符串时Leaflet小部件的渲染

0.17.0 (2015-11-11)

新功能

  • 通过django.contrib.staticfiles传递静态文件的相对URL(感谢@dyve,修复#111)

  • 允许在模板标签级别覆盖设置(感谢@PetrDiouhy,修复#59)

  • 将Leaflet升级到0.7.5 (@dyve)

  • 添加捷克语地区(感谢 @PetrDiouhy)

错误修正

  • 修复与django-geojson的交互问题 (#106,感谢 @batisteo)

  • 在默认OSM瓦片中使用协议无关的URL(感谢 @NotSqrt)

  • 修复已弃用的TEMPLATE_DEBUG (#121,感谢 @josenaka)

  • 修复多词字段名错误 (#123,感谢 @josemazo)

  • 修复表单中未考虑loadevent (#127,感谢 @josemazo)

0.16.0 (2015-04-17)

新功能

  • 添加设置 FORCE_IMAGE_PATH 以绕过Leaflet对图像路径的猜测(当使用django-compressor时很有用)(感谢 @nimasmi)

  • 添加希伯来语翻译(感谢 @nonZero)

  • 使用ugettext_lazy将地图归属翻译

错误修正

  • 修复与点相关的widgets永久挂起的问题(感谢 @Azimkhan,修复了 #90)

  • 调用setView()时移除setTimeout(感谢 @manelclos,修复了 #89)

  • 修复在设置中未定义minZoom/maxZoom时的错误(感谢 Manel Clos)

0.15.2 (2014-12-22)

  • 允许在TILESOVERLAYS设置中设置任何Leaflet瓦片层选项(修复了 #70)。

0.15.1 (2014-12-04)

  • 从README中移除特殊字符(修复了 #82)

  • 修复法语翻译(修复了 #86)

  • 修复es本地化

0.15.0 (2014-10-24)

  • 通过新的设置OVERLAYS添加叠加瓦片层功能。

0.14.2 (2014-10-24)

  • 修复测试中对Django 1.7的支持(感谢 Marco Badan)

  • 添加西班牙语翻译(感谢 David Martinez)

0.14.1 (2014-07-30)

  • 修复地图上的每个draw控件都接收到draw事件的问题。(注意:不再设置map.drawControl属性)

0.14.0 (2014-07-29)

  • 修复创建新的MultiPoint记录时的GeoJSON序列化问题

  • 确保唯一层匹配地图的最大/最小缩放(修复了 #67)(感谢 Manel Clos)

  • 添加编辑同一张地图上多个字段的widget属性

0.13.7 (2014-06-26)

  • 修复默认proj4js路径中的错误(参考 #71)

0.13.6 (2014-06-26)

  • 在需要时在Leaflet表单中设置投影机械装置

  • 在没有安装libgeos的情况下设置Django Leaflet表单字段(感谢 Florent Lebreton)

0.13.5 (2014-06-18)

  • 当使用默认值时防止下载SRID

0.13.4 (2014-06-13)

  • 修复未加载SRID投影文件的错误

0.13.3 (2014-06-10)

  • 升级到Leaflet 0.7.3

0.13.2 (2014-04-15)

  • 修复地图最大缩放为null的回归问题

0.13.1 (2014-04-10)

  • 修复GEOS依赖性,仅作为几何编辑的可选依赖项返回(修复了 #65)

  • 在地图初始化时添加minZoom和maxZoom

  • 添加对S3等高级静态文件位置的兼容性支持(感谢 @jnm)

0.13.0 (2014-03-26)

  • 添加对Django >= 1.4.2的Leaflet表单字段的兼容性支持(感谢 GaĂŤl Utard)

0.12 (2014-03-22)

  • 添加对GeoJSON字段的兼容性支持

0.11.1 (2014-02-12)

  • 如果SRID是3857,则不抱怨瓦片范围

0.11.0 (2014-02-07)

  • SCALE选项中添加对metricimperial的控制(感谢 @smcoll)

  • 升级到Leaflet.draw 0.2.3

0.10.1 (2014-02-03)

  • 升级到Leaflet 0.7.2

0.10.0 (2014-01-22)

  • Python 3支持(感谢 @itbabu)

  • 添加使用Mocha的JavaScript测试

0.9.0 (2013-12-11)

  • 升级到Leaflet 0.7.1

  • 修复在Internet Explorer上始终触发未保存警告的问题

  • 添加DE地区(感谢 @rosscdh)

  • 修复使用python 2.6安装的问题(感谢 @ollb)

0.8.5 (2013-11-05)

  • 修复名称冲突。

0.8.4 (2013-11-05)

  • 修复Django leaflet选项序列化中的回归。

0.8.3 (2013-11-05)

  • 在leaflet模块初始化时切换到lazy gettext

0.8.2 (2013-10-31)

  • 修复多边形绘制问题(修复了 #37)

  • 修复事件附加数据问题,使用jQuery回退(修复了 #38)

  • 修复使用表单前缀时的JavaScript语法错误(修复了 #40)

0.8.1 (2013-09-30)

  • 修复在Admin外使用“plugins=ALL”包含Leaflet库的错误

  • 不要在Admin之外的每个小部件中包含翻译

  • 修复如果表单小部件翻译包含引号时的语法错误

  • 修复如果Leaflet在小部件在DOM中加载后加载时出现的依赖性错误

  • 使用OrderedDicts尊重插件声明顺序

  • 如果PLUGINS['forms']已经存在,则将表单资产添加到前面(而不是扩展)

0.8.0 (2013-09-18)

  • 重命名Leaflet地图片段模板

  • Leaflet地图几何小部件用于adminsite和表单(需要Django 1.6)

  • 修复表单字段中几何类型限制问题(修复了 #32)

  • 使用jQuery触发事件,仅在CustomEvent构造函数不可用时(修复#27,修复#34)

0.7.4 (2013-08-28)

  • 修复不可用时投影下载错误

  • 以与TileCache相同的方式计算分辨率,并提供TileCache配置示例。

  • 如果TILES_EXTENT不是纵向(不支持),则抛出ImproperlyConfigured异常

0.7.3 (2013-08-23)

  • 如果不支持console(),则不要使用它来警告关于已弃用的内容(<IE9)

  • 修复Leaflet 0.6的Reset视图控件的外观

  • 添加法语和意大利语本地化

0.7.2 (2013-08-23)

  • 修复未提供回调值时的JS错误。

0.7.1 (2013-08-21)

  • 修复使用默认瓦片设置初始化地图。

  • 修复地图的fitBounds()到设置中的SPATIAL_EXTENT。

0.7.0 (2013-08-21)

重大更改

  • leaflet_map模板标签不再在全局作用域中注册初始化函数,也不再默认将地图对象添加到window.maps数组中。使用LEAFLET_CONFIG['NO_GLOBALS'] = False来恢复这些功能。

  • 初始化回调函数不再在第二个参数中接收地图的bounds,而是地图选项对象。

弃用

  • JS默认回调函数(<name>Init())用于地图初始化已被弃用。在模板标签中使用显式的callback参数,或监听window事件map:init。(参见README中的使用Leaflet API部分。)

  • LEAFLET_CONFIG中的TILES_URL条目已被弃用。使用TILES代替。

  • 设置查找仅限于LEAFLET_CONFIG字典。最值得注意的是,全局Django设置级别的SRIDMAP_SRIDSPATIAL_EXTENT是不推荐的。

新功能

  • 添加从设置关联图层归属的能力

  • PLUGINS设置中的条目添加auto-include键,以便隐式加载带有leaflet_cssleaflet_js标签的插件。

  • 重写了地图初始化,使其变得不太灵活且难以理解。

  • 使用插件系统为Leaflet.MiniMap。

  • leaflet_map标签添加loadevent参数。

  • 地图初始化现在是幂等的,如果地图已经初始化,则不执行任何操作。

  • 添加ATTRIBUTION_PREFIX设置以全局控制前缀。

0.6.0 (2013-08-08)

  • 升级到Leaflet 0.6.4

0.6.0a(2013-07-05)

  • 升级到Leaflet 0.6.2

  • 升级Leaflet.Minimap(rev 3cd58f7)

  • 升级Proj4Leaflet(rev f4f5b6d)

0.5.1 (2013-04-08)

  • 添加最小地图支持

  • 删除Leaflet版本切换

  • 更新Leaflet到0.5.1

  • 更新Leaflet.Minimap

  • 修复Reset视图按钮的外观

0.4.1 (2012-11-05)

  • 修复模板中的div创建测试

0.4.0 (2012-11-05)

  • 删除英制刻度

  • 添加create_div参数

0.3.0 (2012-10-26)

  • 删除最大分辨率设置,因为它可以计算

  • 即使视图未设置,也允许缩放控制

  • 升级Leaflet到0.4.5

0.2.0 (2012-09-22)

  • 修复模板的打包

  • 使用模板为<head>片段

  • 默认情况下不依赖spatialreference.org

  • SRID的默认设置

  • 地图范围的默认设置

  • 默认地图高度

  • 默认瓦片基础图层

  • map变量不再全局有效

0.1.0 (2012-08-13)

  • 对地图投影的初始支持

  • 默认显示缩放比例

  • 空间范围配置

  • 初始化回调而不是全局JS变量

  • Leaflet版本切换

  • 全局图层配置

0.0.2 (2012-03-22)

  • 添加IE条件CSS

0.0.1 (2012-03-16)

  • 初始工作版本

项目详情


下载文件

下载适合您平台的文件。如果您不确定该选择哪个,请了解更多关于安装包的信息。

源代码分发

django-leaflet-cadasta-0.21.0.tar.gz (284.3 kB 查看哈希值)

上传时间 源代码

支持