From 852ecdc309930166dcd9d1726d449b6f1605ecc5 Mon Sep 17 00:00:00 2001 From: laf Date: Sun, 13 Dec 2015 20:01:08 +0000 Subject: [PATCH] Updated clusters to show red if at least one host is down --- html/css/styles.css | 21 +++++++++++++++++++++ html/includes/common/worldmap.inc.php | 11 +++++++++++ 2 files changed, 32 insertions(+) diff --git a/html/css/styles.css b/html/css/styles.css index 3c2de2ca7..359793729 100644 --- a/html/css/styles.css +++ b/html/css/styles.css @@ -1821,3 +1821,24 @@ label { @media only screen and (min-width: 1024px) { } + +.redCluster { + background-color: rgba(255,0,0); + background-color: rgba(255,0,0,0.7); + text-align: center; + width: 25px !important; + height: 25px !important; + font-size: 14px; + color: white; +} + +.greenCluster { + background-color: rgba(0,255,0); + background-color: rgba(0,255,0,0.7); + text-align: center; + width: 25px !important; + height: 25px !important; + font-size: 14px; + color: black; + border-color:transparent; +} diff --git a/html/includes/common/worldmap.inc.php b/html/includes/common/worldmap.inc.php index cceb080b9..fabda7779 100644 --- a/html/includes/common/worldmap.inc.php +++ b/html/includes/common/worldmap.inc.php @@ -137,6 +137,17 @@ L.tileLayer(\'//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png\', { var markers = L.markerClusterGroup({ maxClusterRadius: ' . $group_radius . ', + iconCreateFunction: function (cluster) { + var markers = cluster.getAllChildMarkers(); + var n = 0; + newClass = "greenCluster marker-cluster marker-cluster-small leaflet-zoom-animated leaflet-clickable"; + for (var i = 0; i < markers.length; i++) { + if (markers[i].options.icon.options.markerColor == "red") { + newClass = "redCluster marker-cluster marker-cluster-small leaflet-zoom-animated leaflet-clickable"; + } + } + return L.divIcon({ html: cluster.getChildCount(), className: newClass, iconSize: L.point(40, 40) }); + }, }); var redMarker = L.AwesomeMarkers.icon({ icon: \'server\',