Как изменить цвет слоя шейп-файла в карте Leaflet в Django Admin на основе значения поля?

Я работаю над проектом GeoDjango, в котором я отображаю слой shapefile в Leaflet map, встроенном в интерфейс Django Admin. Мне нужно динамически раскрашивать геометрию (поле geom) на карте, основываясь на значении другого поля в модели под названием mean_ctrl. Django Admin с полем 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"

Я ищу руководство о том, как применить эту цветовую схему к полю Geom на карте Leaflet в админке Django. Любое руководство будет очень полезным! Спасибо.

Чтобы динамически применять цвета на основе поля mean_ctrl в вашем проекте GeoDjango, вы можете настроить карту Leaflet в интерфейсе Django Admin. Вот как это можно сделать:

  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 Admin Form: В админке вашей модели используйте этот виджет для поля геометрии.

    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 Admin. Дайте мне знать, если вам нужна дополнительная помощь с JavaScript или настройкой Leaflet!

Вернуться на верх