60 lines
1.9 KiB
HTML
60 lines
1.9 KiB
HTML
{% extends "mapsapp/map2d_base.html" %}
|
|
{% load static %}
|
|
{% block title %}Вынос точек{% endblock title %}
|
|
|
|
{% block extra_js %}
|
|
<script>
|
|
// Цвета для стандартных маркеров (из leaflet-color-markers)
|
|
var markerColors = ['red', 'green', 'orange', 'violet', 'grey', 'black', 'blue'];
|
|
var getColorIcon = function(color) {
|
|
return L.icon({
|
|
iconUrl: '{% static "leaflet-markers/img/marker-icon-" %}' + color + '.png',
|
|
shadowUrl: '{% static "leaflet-markers/img/marker-shadow.png" %}',
|
|
iconSize: [25, 41],
|
|
iconAnchor: [12, 41],
|
|
popupAnchor: [1, -34],
|
|
shadowSize: [41, 41]
|
|
});
|
|
};
|
|
|
|
var overlays = [];
|
|
|
|
{% for group in groups %}
|
|
var groupIndex = {{ forloop.counter0 }};
|
|
var colorName = markerColors[groupIndex % markerColors.length];
|
|
var groupIcon = getColorIcon(colorName);
|
|
|
|
var groupLayer = L.layerGroup();
|
|
|
|
var subgroup = [];
|
|
{% for point_data in group.points %}
|
|
var pointName = "{{ group.name|escapejs }}";
|
|
|
|
var marker = L.marker([{{ point_data.point.1|safe }}, {{ point_data.point.0|safe }}], {
|
|
icon: groupIcon
|
|
}).bindPopup(pointName);
|
|
|
|
groupLayer.addLayer(marker);
|
|
|
|
subgroup.push({
|
|
label: "{{ forloop.counter }} - {{ point_data.frequency }}",
|
|
layer: marker
|
|
});
|
|
{% endfor %}
|
|
|
|
overlays.push({
|
|
label: '{{ group.name|escapejs }}',
|
|
selectAllCheckbox: true,
|
|
children: subgroup,
|
|
layer: groupLayer
|
|
});
|
|
{% endfor %}
|
|
|
|
|
|
// Используем именно tree-контрол
|
|
L.control.layers.tree(baseLayers, overlays, {
|
|
collapsed: false,
|
|
autoZIndex: true
|
|
}).addTo(map);
|
|
</script>
|
|
{% endblock extra_js %} |