如何根据字段值更改 Django Admin 的 Leaflet 地图中 shapefile 图层的颜色？

Question

我正在开发一个 GeoDjango 项目，其中我在嵌入 Django Admin 界面的 Leaflet 地图中显示 shapefile 层。我需要根据模型中另一个名为mean_ctrl 的字段的值动态为地图中的几何图形（geom 字段）着色。 Django 管理员与 Geom 字段

这是我想要实现的配色方案：

def get_color(mean_ctrl):
    if mean_ctrl < 60:
        return "#38A800"
    elif 60.1 <= mean_ctrl <= 120:
        return "#55FF00"
    elif 120.1 <= mean_ctrl <= 170:
        return "#FFFF00"
    elif 170.1 <= mean_ctrl <= 220:
        return "#FFAA00"
    elif 220.1 <= mean_ctrl <= 270:
        return "#FF0000"
    else:
        return "#C500FF"

我正在寻找有关如何将此配色方案应用于 Django 管理中的 Leaflet 地图上的 Geom 字段的指南。任何指导都会非常有帮助！谢谢。

Answer 1

要根据 GeoDjango 项目中的

mean_ctrl

字段动态应用颜色，您可以在 Django 管理界面中自定义 Leaflet 地图。以下是您可以采取的方法：

1. 覆盖 Django Admin 中的地图小部件：自定义用于在管理界面中渲染几何图形的地图小部件。

2. 添加用于颜色映射的 JavaScript：在管理模板中使用 JavaScript 根据

   mean_ctrl

   字段为几何图形着色。

分步解决方案

1. 创建自定义管理小部件： 通过扩展

   AdminGeoWidget

   并添加 JavaScript 以基于

   mean_ctrl

   设置颜色来定义自定义小部件。

   from django.contrib.gis import admin
   from django.forms import widgets
   
   class ColoredAdminGeoWidget(admin.widgets.OSMWidget):
       template_name = 'custom_geo_widget.html'
   

2. 使用 JavaScript 应用颜色： 为小部件

   custom_geo_widget.html

   创建自定义模板文件，并嵌入 JavaScript，该文件将根据其

   mean_ctrl

   值动态设置每个几何图形的样式。

   {% load static %}
   <link rel="stylesheet" href="{% static 'path/to/leaflet.css' %}" />
   <script src="{% static 'path/to/leaflet.js' %}"></script>
   
   <script type="text/javascript">
       function getColor(mean_ctrl) {
           if (mean_ctrl < 60) return "#38A800";
           else if (mean_ctrl <= 120) return "#55FF00";
           else if (mean_ctrl <= 170) return "#FFFF00";
           else if (mean_ctrl <= 220) return "#FFAA00";
           else if (mean_ctrl <= 270) return "#FF0000";
           else return "#C500FF";
       }
   
       document.addEventListener("DOMContentLoaded", function () {
           // Assuming each geometry has an associated mean_ctrl property
           L.geoJSON(geojson_data, {
               style: function(feature) {
                   return { color: getColor(feature.properties.mean_ctrl) };
               }
           }).addTo(map);
       });
   </script>
   

   • 将

     geojson_data

     替换为保存 GeoJSON 格式几何数据的变量。
   • 确保 GeoJSON 中的每个几何图形都包含

     mean_ctrl

     下的

     feature.properties

     字段。

3. 修改 Django 管理表单： 在您的模型管理中，将此小部件用于几何字段。

   from django.contrib import admin
   from .models import YourModel
   from .widgets import ColoredAdminGeoWidget
   
   class YourModelAdmin(admin.ModelAdmin):
       formfield_overrides = {
           'geom': {'widget': ColoredAdminGeoWidget},
       }
   
   admin.site.register(YourModel, YourModelAdmin)
   

此设置将根据

mean_ctrl

值动态应用您的配色方案，从而增强 Django 管理中的地图可视化效果。如果您需要有关 JavaScript 或 Leaflet 配置的进一步帮助，请告诉我！