perso/DOCKER_wordpress
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

filters works with two modes, show_only true or false

Browse Source
This commit is contained in:
lenovo
2022-11-12 11:05:46 +01:00
parent 03bfc6214a
commit 7bbad5a4ec
3 changed files with 43 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
srcs/plugins/map_prof/mp_create_div.php
View File

@@ -17,7 +17,7 @@ function mp_create_div(&$filters) {
'; ';
foreach ($filter as $value) { foreach ($filter as $value) {
$mp_map_div .= ' $mp_map_div .= '
<p onclick="filter_show_only_selection('.json_encode($value->indexes).')">'.$value->_name.'</p> <p onclick="filter_show_only_selection('.json_encode($value->indexes).', false)">'.$value->_name.'</p>
'; ';
} }
$mp_map_div .= ' $mp_map_div .= '

52
srcs/plugins/map_prof/scripts/mp_filter_events.js
View File

@@ -3,36 +3,54 @@
// add true for noDraw // add true for noDraw
// bounds : https://stackoverflow.com/questions/19304574/center-set-zoom-of-map-to-cover-all-visible-markers/19304625#19304625 // bounds : https://stackoverflow.com/questions/19304574/center-set-zoom-of-map-to-cover-all-visible-markers/19304625#19304625
function filter_show_only_selection(indexes) { /**
console.log("filter_show_only_selection"); * if show_only is true:
* erase all other markers from the map,
* else, they stay visible
*/
function filter_show_only_selection(indexes, show_only = true) {
marker_cluster.clearMarkers(true); let indexes_count = indexes.length;
//marker_cluster.removeMarkers(markers, true); if (indexes_count === 0)
return;
let current_bounds = map.getBounds(); if (show_only)
g_marker_cluster.clearMarkers(true);
let marker = g_markers[0];
let position = marker.getPosition();
let current_bounds = g_map.getBounds();
console.log("current_bounds:"); console.log("current_bounds:");
console.log(current_bounds); console.log(current_bounds);
let bounds = new google.maps.LatLngBounds(current_bounds); let bounds = new google.maps.LatLngBounds(position);
console.log("bounds:"); console.log("bounds:");
console.log(bounds); console.log(bounds);
//for (let index of indexes)
let outside_bounds = false;
for (let index of indexes) { for (let index of indexes) {
let marker = markers[index]; marker = g_markers[index];
let position = marker.getPosition(); position = marker.getPosition();
console.log(position); if (! current_bounds.contains(position))
console.log(bounds.contains(position)); outside_bounds = true;
bounds.extend(position);
marker_cluster.addMarker(marker, true); if (show_only)
g_marker_cluster.addMarker(marker, true);
} }
marker_cluster.render(); if ( show_only == false || (show_only && outside_bounds) ) {
if (indexes_count === 1) {
g_map.setCenter(position);
g_map.setZoom(5);
}
else if (indexes_count > 1)
g_map.fitBounds(bounds);
}
if (show_only)
g_marker_cluster.render();
} }
function filter_show_all() { function filter_show_all() {
console.log("filter_show_all"); console.log("filter_show_all");
marker_cluster.addMarkers(markers); marker_cluster.addMarkers(markers);
} }
function filter_zoom_on_selection(indexes) {
marker_cluster.addMarkers(markers);
}

16
srcs/plugins/map_prof/scripts/mp_init_map.js
View File

@@ -1,8 +1,7 @@
let map = {}; let g_map = {};
let markers = []; let g_markers = [];
let marker_cluster = {}; let g_marker_cluster = {};
//let bounds = {};
function mp_init_map() { function mp_init_map() {
@@ -45,20 +44,19 @@ function mp_init_map() {
let map_div = document.getElementById("ljdp_map"); let map_div = document.getElementById("ljdp_map");
//let filters_div = document.getElementById("ljdp_map_filters"); //let filters_div = document.getElementById("ljdp_map_filters");
let infowindow = new google.maps.InfoWindow(); let infowindow = new google.maps.InfoWindow();
//bounds = new google.maps.LatLngBounds();
/* /*
* DRAW MAP * DRAW MAP
*/ */
map = create_map(map_div); g_map = create_map(map_div);
markers = create_markers(map, locations, infowindow); g_markers = create_markers(g_map, locations, infowindow);
marker_cluster = draw_clusters(map, markers); g_marker_cluster = draw_clusters(g_map, g_markers);
// add listener to close infowindow at any click on map // add listener to close infowindow at any click on map
map.addListener('click', function() { g_map.addListener('click', function() {
infowindow.close(); infowindow.close();
}); });