1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
|
{% load i18n window_field %}{% if PROFILE.mapping and geo_item.main_geodata %}
{% with geodata_list=geo_item.geodata_list %}
<div class="col-12 col-lg-6 flex-wrap">
<div class="window-map" id="map-{{window_id}}-{{geo_item.SLUG}}-{{geo_item.pk}}">
</div>
<div id="map-content-{{window_id}}-{{geo_item.SLUG}}-{{geo_item.pk}}"></div>
</div>
<div class="col-12 col-lg-6 flex-wrap">
<h4>{% trans "Geographic data" %}</h4>
<ul>{% for geodata in geodata_list %}
<li>
<input type="checkbox" name="map-ol-{{item.SLUG}}-{{item.pk}}-{{geodata.pk}}"
id="map-ol-{{item.SLUG}}-{{item.pk}}-{{geodata.pk}}"
{% if not forloop.counter0 %}checked{% endif %}
>
<label for="map-ol-{{item.SLUG}}-{{item.pk}}-{{geodata.pk}}">
<strong>{{geodata.data_type}}</strong></label><br/>
{{geodata.name}}
</li>{% endfor %}
</ul>
</div>
<script type="text/javascript">
const refresh_map_{{item.SLUG}}_{{item.pk}} = function(first_init) {
var {{geo_item.SLUG}}{{geo_item.pk}}_point = {"type": "FeatureCollection", "features": []};
var {{geo_item.SLUG}}{{geo_item.pk}}_other = {"type": "FeatureCollection", "features": []};
{% for geodata in geodata_list %}
if ($("#map-ol-{{item.SLUG}}-{{item.pk}}-{{geodata.pk}}").prop('checked')){
let geojson = {{geodata.geojson|safe}};
{% if geodata.geometry_type == 'POINT' %}
Array.prototype.push.apply({{geo_item.SLUG}}{{geo_item.pk}}_point["features"],
geojson["features"]);
{% else %}
Array.prototype.push.apply({{geo_item.SLUG}}{{geo_item.pk}}_other["features"],
geojson["features"]);
{% endif %}
}{% endfor %}
display_lines_and_polys("map-{{window_id}}-{{geo_item.SLUG}}-{{geo_item.pk}}", {{geo_item.SLUG}}{{geo_item.pk}}_other, first_init);
display_points("map-{{window_id}}-{{geo_item.SLUG}}-{{geo_item.pk}}", {{geo_item.SLUG}}{{geo_item.pk}}_point, first_init);
}
const display_map_{{item.SLUG}}_{{item.pk}} = function() {
const html = render_map("map-{{window_id}}-{{geo_item.SLUG}}-{{geo_item.pk}}", false, true);
$("#map-content-{{window_id}}-{{geo_item.SLUG}}-{{geo_item.pk}}").html(html);
display_map("map-{{window_id}}-{{geo_item.SLUG}}-{{geo_item.pk}}", null, null);
{% for geodata in geodata_list %}
$("#map-ol-{{item.SLUG}}-{{item.pk}}-{{geodata.pk}}").change(
function(){
refresh_map_{{item.SLUG}}_{{item.pk}}(false);
}
);
{% endfor %}
}
display_map_{{item.SLUG}}_{{item.pk}}();
refresh_map_{{item.SLUG}}_{{item.pk}}(true);
{% if geo_item.SLUG == "operation" or geo_item.SLUG == "contextrecord" %}
const disp_geo_items = function(disp_cr, disp_bf, get_polygons) {
if (disp_cr || disp_bf) {
const get_poly = (get_polygons === "polygons");
let url = null;
if (get_poly) {
url = "{% url 'api-get-geo-polygons' %}";
}
else {
url = "{% url 'api-get-geo-points' %}";
}
display_geo_items("map-{{window_id}}-{{geo_item.SLUG}}-{{geo_item.pk}}", url, "{{geo_item.SLUG}}",
"{{geo_item.pk}}", disp_cr, disp_bf, get_poly);
}
}
let geo_items_displayed_once = false;
const disp_bf = $("#disp-bf-for-{{geo_item.SLUG}}-{{geo_item.pk}}");
const get_polygons = $("#get-poly-for-{{geo_item.SLUG}}-{{geo_item.pk}}");
{% if geo_item.SLUG == "operation" %}
const disp_cr = $("#disp-cr-for-{{geo_item.SLUG}}-{{geo_item.pk}}");
const event_func_disp_geo_items = function () {
if (geo_items_displayed_once) {
disp_map();
}
else { geo_items_displayed_once = true; }
disp_geo_items(disp_cr.prop('checked'), disp_bf.prop('checked'), get_polygons.val());
}
disp_cr.change( event_func_disp_geo_items );
disp_bf.change( event_func_disp_geo_items );
get_polygons.change( function () {
disp_map();
disp_geo_items(disp_cr.prop('checked'), disp_bf.prop('checked'), get_polygons.val());
})
{% else %}
const event_func_disp_geo_items = function () {
if (geo_items_displayed_once) {
disp_map();
}
else { geo_items_displayed_once = true; }
disp_geo_items(false, disp_bf.prop('checked'), get_polygons.val());
}
disp_bf.change( event_func_disp_geo_items );
get_polygons.change( function () {
disp_map();
disp_geo_items(false, disp_bf.prop('checked'), get_polygons.val());
})
{% endif %}
{% endif %}
</script>
{% endwith %}
{% endif %}
|