Dash Organizado + Control Panel

Clouds/data/Prácticas 20190805.txt

-sudo apt-get install build-essential libcurl4-gnutls-dev libxml2-dev libssl-dev
-
-R
-
-install.packages('devtools')
-install_github("lchiffon/wordcloud2")
-
-Function.Base.Config.Environment()
-
-
-
-library(wordcloud2)
-wordcloud2(data = demoFreq)
-
-
-figPath = system.file("../Logos/Huella_H.png",package = "wordcloud2")
-wordcloud2(demoFreq, figPath = figPath, size = 1.5,color = "skyblue")
-
-
-
-
-
-Function.Base.Config.Environment()
-
-Data.Original=read.csv("../Tweets/LaPAzI_2019_08_03T21_46_49_341Z.csv")
-
-Data.Original.DF = as.data.frame(cbind(Data.Original$ID, as.character(Data.Original$Text)))
-colnames(Data.Original.DF) = c("doc_id", "text")
-
-Data.Original.DF.Corpus=Function.TM.CreateCorpus(Data.Original.DF, pLanguage="spanish", aStopWords=c("paz", "...", "\"", "…", "“", "¿según", "“lamento…", "¿amlo", "httpstcol7x7dzwdrvalvarouribevel", "pased…", "pasedel…", "valoresbuen…", "guarderiaabcpasedelista11…", "l…", "q…", "”", "‘", "d…", "excusasq…", "c…", "¿tuitearían"));
-
-Data.Original.DF.Corpus.DTM=Function.TM.CreateDTM(Data.Original.DF.Corpus)
-
-Function.TM.SaveFreqV(Data.Original.DF.Corpus.FreqV)
-
-
-
-Function.TM.Freq.CreateCloud(Data.Original.DF.Corpus.DTM)
-
-
-Data.Original.DF.Corpus.FreqV=Function.TM.GetFreqV(Data.Original.DF.Corpus.DTM)
-
-
-wordcloud2(Data.Original.DF.Corpus.FreqV, figPath = "R.jpg", size = 1.5,color = "skyblue")
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-

Dash/ControlPanel/config.php

+<?php
+	session_start();
+
+			include '../SQL/conexion.php';
+
+			$lvl=$_GET["lvl"];
+			$sql = "SELECT CV_CCT as Clave, ".($lvl=="Superior"?"MUNICIPIO":$lvl=="Media"?"MUNICIPIO":"C_NOM_MUN")." as Municipio, NOMBRECT as Institucion, COUNT(respuesta.id_respuesta) AS Respuestas FROM ".$lvl." LEFT JOIN respuesta ON CV_CCT = respuesta.clave_escuela GROUP BY CV_CCT, NOMBRECT;";
+//			$result = $conn->query($sql)
+
+	
+	if (isset($_SESSION["userType"]) && $_SESSION["userType"] == 965){
+
+?>
+					<!-- Page Heading -->
+					<div class="d-sm-flex align-items-center justify-content-between mb-4">
+						<h1 class="h3 mb-0 text-gray-800"><i class="fas fa-fw fa-tools"></i> Proyect Config</h1>
+					</div>
+
+					<!-- Content Row -->
+					<div class="row">
+
+						<!-- ID Card -->
+						<div class="col-xl-3 col-md-6 mb-4">
+							<div class="card border-left-danger shadow h-100 py-2">
+								<div class="card-body">
+									<div class="row no-gutters align-items-center">
+										<div class="col mr-2">
+											<div class="text-xs font-weight-bold text-danger text-uppercase mb-1">Loged as Root</div>
+										</div>
+										<div class="col-auto">
+											<i class="fas fa-user-lock fa-2x text-gray-300"></i>
+										</div>
+									</div>
+								</div>
+							</div>
+						</div>
+						
+					</div>
+					
+					
+					<div class="row">
+
+						<!-- Salida del sistema -->
+						<div class="col-xl-9 col-lg-9">
+							<div class="card shadow mb-4">
+								<!-- Card Header - Dropdown -->
+								<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
+									<h6 class="m-0 font-weight-bold text-primary">System output</h6>
+								</div>
+								<!-- Card Body -->
+								<div id="outputDIV" class="card-body">								
+								</div>
+							</div>
+						</div>
+
+						<!-- Opciones del sistema -->
+						<div class="col-xl-3 col-lg-3">
+							<div class="card shadow mb-4">
+								<!-- Card Header - Dropdown -->
+								<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
+									<h6 class="m-0 font-weight-bold text-primary">System Tasks</h6>									
+								</div>
+								<!-- Card Body -->
+								<div class="card-body">
+
+									<div class="container">
+									  <ul class="ks-cboxtags">
+										<li><input type="checkbox" id="cbCDUP" value="" checked onchange="$(this).prop('disabled', true); getConfig('ControlPanel/executeCfg.php?act=CDUP');"><label for="cbCDUP">Count duplicates</label></li>
+										<li><input type="checkbox" id="cbDDUP" value="" checked onchange="$(this).prop('disabled', true); getConfig('ControlPanel/executeCfg.php?act=DDUP');"><label for="cbDDUP">Delete duplicates</label></li>
+										<li><input type="checkbox" id="cbCEMP" value="" checked onchange="$(this).prop('disabled', true); getConfig('ControlPanel/executeCfg.php?act=CEMP');"><label for="cbCEMP">Count empty</label></li>
+										<li><input type="checkbox" id="cbDEMO" value="" checked onchange="$(this).prop('disabled', true); getConfig('ControlPanel/executeCfg.php?act=DEMP');"><label for="cbDEMO">Delete empty</label></li>
+										<li><input type="checkbox" id="cbLIST" value="" checked onchange="$(this).prop('disabled', true); getConfig('ControlPanel/executeCfg.php?act=LIST');"><label for="cbLIST">Update R's CSV</label></li>
+										<li><input type="checkbox" id="cbRWC" value="" checked onchange="$(this).prop('disabled', true); getConfig('ControlPanel/executeCfg.php?act=RWC');"><label for="cbRWC">Update Wordcloud</label></li>
+										<li><input type="checkbox" id="cbMBAK" value="" checked onchange="$(this).prop('disabled', true); getConfig('ControlPanel/executeCfg.php?act=MBAK');"><label for="cbMBAK">Backup Database</label></li>
+										<li><input type="checkbox" id="cbANAME" value="" checked onchange="$(this).prop('checked', true); getConfig('ControlPanel/executeCfg.php?act=ANAME');"><label for="cbANAME">Annotate Names</label></li>
+									  </ul>
+									</div>
+									
+								</div>
+							</div>
+							
+						</div>
+					</div>
+
+	<script>
+
+		// Obtenemos el control del DIV principal...
+		var DivOutput = document.getElementById("outputDIV");
+		
+		// Request de actualización dinámica (main)...
+		var configClient = new XMLHttpRequest();
+		
+		// Actualiza div contenedor (main)...
+		getConfig = function (wPage){
+			// Create a FormData instance...
+			var upData = new FormData();
+			// Set POST data...
+			configClient.open("post", wPage, true);
+			// Send to server...
+			configClient.send(upData);
+			// User message...
+			DivOutput.innerHTML = "Executing task...";
+			// Terminamos...
+			return true;
+		}
+					
+		// Respuesta del cliente main...
+		configClient.onreadystatechange = function(){
+			// Status OK...
+			if (configClient.readyState == 4 && configClient.status == 200){
+				// Check for errors on response...
+				if (configClient.responseText.indexOf('Error!') != -1) {
+					// Present data to user...
+					DivOutput.innerHTML = configClient.responseText;
+				}else{
+					// Present data to user...
+					DivOutput.innerHTML = configClient.responseText;
+					// Clear response...
+					configClient.responseText = "";
+				}
+			}else{
+				DivOutput.innerHTML = "Error!";
+			}
+			
+		}
+	</script>					
+					
+					
+<?php
+
+	}else{
+		echo "<script> UpdatePage('ControlPanel/loginCfg.php') </script>";
+	}
+	
+?>

Dash/ControlPanel/executeCfg.php

+<?php
+	session_start();
+
+	include '../SQL/conexion.php';
+
+	if (!isset($_SESSION["userType"]) || $_SESSION["userType"] != 965){
+		echo "Sin autorización!";
+		exit;
+	}
+	
+	if(isset($_GET["act"])){
+	
+		if($_GET["act"]=="CDUP"){
+			$sql = "select t1.id_respuesta from respuesta t1 inner join respuesta t2 where t1.id_respuesta > t2.id_respuesta AND t1.nombre = t2.nombre and t1.edad = t2.edad and t1.comentario = t2.comentario and t1.clave_escuela = t2.clave_escuela;";
+			$result = $conn->query($sql);
+			echo "Found ". $result->num_rows ." duplicated registers...";
+			exit;
+		}
+
+		if($_GET["act"]=="DDUP"){
+			$sql = "delete t1 from respuesta t1 inner join respuesta t2 where t1.id_respuesta > t2.id_respuesta AND t1.nombre = t2.nombre and t1.edad = t2.edad and t1.comentario = t2.comentario and t1.clave_escuela = t2.clave_escuela;";
+			if(!$conn->query($sql))
+				echo "Error! ".$conn->error;
+			else
+				echo "Result: " . $conn->affected_rows . " rows deleted...";
+			exit;
+		}
+
+		if($_GET["act"]=="CEMP"){
+			$sql = "select * from respuesta where clave_escuela='';";
+			$result = $conn->query($sql);
+			echo "Found ". $result->num_rows ." empty registers...";
+			exit;
+		}
+
+		if($_GET["act"]=="DEMP"){
+			$sql = "delete from respuesta where clave_escuela='';";
+			if(!$conn->query($sql))
+				echo "Error! ".$conn->error;
+			else
+				echo "Result: " . $conn->affected_rows . " rows deleted...";
+			exit;
+		}
+		
+		if($_GET["act"]=="LIST"){
+
+			$sql = 'SELECT id_respuesta, comentario, nombre FROM respuesta';
+			$result = $conn->query($sql);
+
+				if (!empty($result)) {
+					$fp = fopen('../WordCloud/R/Data/Last.csv', 'w');
+					fwrite($fp, "\"ID\", \"Text\", \"Nombre\"\n");
+					foreach ($result as $respuesta) { 
+						fwrite($fp, $respuesta["id_respuesta"].",\"".str_replace("\"","", preg_replace('/\s+/S', " ", $respuesta["comentario"]))."\",\"".explode(" ", trim(strtolower($respuesta["nombre"])))[0]."\"\n");
+					}
+					fclose($fp);	    
+				}
+
+				echo "Wrote ". $result->num_rows ." registers...";
+				exit;
+		}
+		
+		if($_GET["act"]=="RWC"){
+
+				$output = "";
+				exec("cd ../WordCloud/R/; R -e 'sessionInfo()' --quiet; chmod a+rw Data/Data.js", $output);
+				foreach ($output as $line)
+					echo $line."<br>";
+				exit;
+		}				
+
+
+		if($_GET["act"]=="MBAK"){
+
+				$output = "";
+				exec("mysqldump --user=backupuser --password=PkJXPQFykKLmS3cWhjhgfjdsqmZKNYE Escuelas > /data/public_html/BAK/Escuelas_$(date +%s).sql && ls /data/public_html/BAK/ -lsh | tail -1 && rm /data/public_html/BAK/$(ls /data/public_html/BAK/ | head -1)", $output);
+				foreach ($output as $line)
+					echo $line."<br>";
+				exit;
+		}
+		
+		if($_GET["act"]=="ANAME"){
+
+				if(isset($_GET["Name"]) && isset($_GET["Sex"])){
+					$sql = "INSERT INTO `Nombres`(`Nombre`, `sexo`) VALUES ('".$_GET['Name']."','".$_GET['Sex']."');";
+					$conn->query($sql);
+				}
+
+				$sql = "SELECT SUBSTRING_INDEX(TRIM(respuesta.nombre), ' ', 1) as Nombre  from respuesta left join Nombres on SUBSTRING_INDEX(TRIM(respuesta.nombre), ' ', 1) = Nombres.Nombre WHERE Nombres.sexo IS NULL GROUP BY SUBSTRING_INDEX(TRIM(respuesta.nombre), ' ', 1) LIMIT 1;";
+				$result = $conn->query($sql);
+					foreach ($result as $respuesta){
+						echo '<center><h1 class="m-0 font-weight-bold text-info mb-3 mt-3">'.str_replace("<", "", $respuesta["Nombre"]).'</h1>';
+						echo '<a href="#cf" class="btn btn-primary btn-icon-split mr-3" onclick="getConfig( \'ControlPanel/executeCfg.php?act=ANAME&Name='.$respuesta["Nombre"].'&Sex=Masculino \');"><span class="icon text-white-50"><i class="fas fa-male"></i></span><span class="text">Masculino</span></a>';
+						echo '<a href="#cf" class="btn btn-info btn-icon-split mr-3" onclick="getConfig( \'ControlPanel/executeCfg.php?act=ANAME&Name='.$respuesta["Nombre"].'&Sex=Femenino \');"><span class="icon text-white-50"><i class="fas fa-female"></i></span><span class="text">Femenino</span></a>';
+						echo '<a href="#cf" class="btn btn-warning btn-icon-split mr-3" onclick="getConfig( \'ControlPanel/executeCfg.php?act=ANAME&Name='.$respuesta["Nombre"].'&Sex=Desconocido \');"><span class="icon text-white-50"><i class="fas fa-female"></i></span><span class="text">Desconocido</span></a></center>';
+						exit;
+					}
+					echo '<center><h1 class="m-0 font-weight-bold text-success mb-3 mt-3">No names to annotate</h1>';
+					exit;
+		}
+	}
+	echo "Nothing to do...";
+?>

Dash/ControlPanel/loginCfg.php

+<?php
+	session_start();
+	
+	if (!isset($_SESSION["userType"]) || $_SESSION["userType"] != 965){
+?>
+
+					<!-- Nested Row within Card Body -->
+					<div class="row align-center" >
+						<div class="col-xl-4 col-md-6 col-centered">
+							<div class="p-5">
+								<div class="text-center">
+									<i class="fas fa-user-lock fa-4x"></i>
+									<h1 class="h4 text-gray-900 mb-4">Login as root</h1>
+									<?php
+										/*
+											if($_SESSION["userType"] == -1)
+												echo '<div class="text-xs font-weight-bold text-info text-uppercase mb-1">Ingresa el nombre de usuario</div>';
+											else if($_SESSION["userType"] == -2)
+												echo '<div class="text-xs font-weight-bold text-danger text-uppercase mb-1">Nombre de usuario incorrecto</div>';
+											else if($_SESSION["userType"] == -3)
+												echo '<div class="text-xs font-weight-bold text-info text-uppercase mb-1">Ingresa la incorrecta</div>';
+											else if($_SESSION["userType"] == -4)
+												echo '<div class="text-xs font-weight-bold text-danger text-uppercase mb-1">Contraseña incorrecta</div>';
+										*/
+										if($_SESSION["userType"] < 0)
+											echo '<div class="text-xs font-weight-bold text-danger text-uppercase mb-1">Nombre de usuario y contraseña incorrectos</div>';
+												
+
+											
+									?>									
+								</div>
+								<form id="lform" class="user" action="/#cf" method="post">
+									<div class="form-group">
+										<input type="username" class="form-control form-control-user" name="username" id="username" aria-describedby="userHelp" placeholder="Enter you Username...">
+									</div>
+									<div class="form-group">
+										<input type="password" class="form-control form-control-user" name="password" id="password" placeholder="Password">
+									</div>
+									<a href="#cf" class="btn btn-primary btn-user btn-block" onclick="$('#lform').submit();">
+										Login
+									</a>
+								</form>
+							</div>
+						</div>
+					</div>
+					
+					
+					<script>
+					$('#username').focus();
+					
+					$('input').keydown( function(e) {
+							var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
+							if(key == 13) {
+								e.preventDefault();
+								var inputs = $(this).closest('form').find(':input:visible');
+								if(inputs.eq( inputs.index(this)+ 1 ).length){
+									inputs.eq( inputs.index(this)+ 1 ).focus();
+								}else{
+									$('#lform').submit();
+								}
+							}
+						});				
+					
+					</script>
+					
+<?php
+	}else{
+		echo "<script> UpdatePage('ControlPanel/config.php') </script>";
+	}
+?>

Dash/Maps/css/MarkerCluster.Default.css

+.marker-cluster-small {
+	background-color: rgba(181, 226, 140, 0.0);
+	}
+.marker-cluster-small div {
+	background-color: rgba(110, 204, 57, 0.0);
+	}
+
+.marker-cluster-medium {
+	background-color: rgba(241, 211, 87, 0.0);
+	}
+.marker-cluster-medium div {
+	background-color: rgba(240, 194, 12, 0.0);
+	}
+
+.marker-cluster-large {
+	background-color: rgba(253, 156, 115, 0.0);
+	}
+.marker-cluster-large div {
+	background-color: rgba(241, 128, 23, 0.0);
+	}
+
+
+	/* IE 6-8 fallback colors */
+.leaflet-oldie .marker-cluster-small {
+	background-color: rgb(181, 226, 140);
+	}
+.leaflet-oldie .marker-cluster-small div {
+	background-color: rgb(110, 204, 57);
+	}
+
+.leaflet-oldie .marker-cluster-medium {
+	background-color: rgb(241, 211, 87);
+	}
+.leaflet-oldie .marker-cluster-medium div {
+	background-color: rgb(240, 194, 12);
+	}
+
+.leaflet-oldie .marker-cluster-large {
+	background-color: rgb(253, 156, 115);
+	}
+.leaflet-oldie .marker-cluster-large div {
+	background-color: rgb(241, 128, 23);
+}
+
+.marker-cluster {
+	background-clip: padding-box;
+	border-radius: 20px;
+	}
+.marker-cluster div {
+	width: 30px;
+	height: 30px;
+	margin-left: 5px;
+	margin-top: 5px;
+
+	text-align: center;
+	border-radius: 15px;
+	font: 12px "Helvetica Neue", Arial, Helvetica, sans-serif;
+	}
+.marker-cluster span {
+	line-height: 30px;
+	}

Dash/Maps/css/MarkerCluster.css

+.leaflet-cluster-anim .leaflet-marker-icon, .leaflet-cluster-anim .leaflet-marker-shadow {
+	-webkit-transition: -webkit-transform 0.3s ease-out, opacity 0.3s ease-in;
+	-moz-transition: -moz-transform 0.3s ease-out, opacity 0.3s ease-in;
+	-o-transition: -o-transform 0.3s ease-out, opacity 0.3s ease-in;
+	transition: transform 0.3s ease-out, opacity 0.3s ease-in;
+	}

Dash/Maps/css/style.css

+
+.container {
+    max-width: 640px;
+    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    font-size: 12px;
+    font-weight: bold;
+}
+
+ul.ks-cboxtags {
+    list-style: none;
+    padding: 20px;
+}
+ul.ks-cboxtags li{
+  display: inline;
+}
+
+ul.ks-cboxtags li label{
+	width: 80px;
+    display: block;
+    background-color: rgba(255, 255, 255, .9);
+    border: 0px solid rgba(139, 139, 139, .3);
+    color: #adadad;
+    border-radius: 25px;
+    white-space: nowrap;
+    margin: 15px -50px;
+    
+	-webkit-box-shadow: 3px 10px 34px -7px rgba(0,0,0,0.75);
+	-moz-box-shadow: 3px 10px 34px -7px rgba(0,0,0,0.75);
+	box-shadow: 3px 10px 34px -7px rgba(0,0,0,0.75);
+
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    -webkit-tap-highlight-color: transparent;
+    transition: all .2s;
+}
+
+ul.ks-cboxtags li label {
+    padding: 8px 40px;
+    cursor: pointer;
+}
+
+ul.ks-cboxtags li label::before {
+    display: inline-block;
+    font-style: normal;
+    font-variant: normal;
+    text-rendering: auto;
+    -webkit-font-smoothing: antialiased;
+    font-family: "Font Awesome 5 Free";
+    font-weight: 900;
+    font-size: 12px;
+    padding: 2px 6px 2px 2px;
+    content: "\f067";
+    transition: transform .3s ease-in-out;
+}
+
+ul.ks-cboxtags li input[type="checkbox"]:checked + label::before {
+    content: "\f00c";
+    transform: rotate(-360deg);
+    transition: transform .3s ease-in-out;
+    
+}
+
+ul.ks-cboxtags li input[type="checkbox"]:checked + label {
+    border: 0px solid #3b67b8;
+    background-color: #4579d9;
+    color: #fff;
+    transition: all .2s;    
+}
+
+ul.ks-cboxtags li input[type="checkbox"] {
+  display: absolute;
+}
+ul.ks-cboxtags li input[type="checkbox"] {
+  position: absolute;
+  opacity: 0;
+}
+ul.ks-cboxtags li input[type="checkbox"]:focus + label {
+  
+}
+
+
+#map-canvas {
+	width: 100%;
+	height: 100%;
+	}
+
+h1 {
+	color:#000000;
+	font-size:15px;
+	font-family: 'Signika', sans-serif;
+	cursor:default;
+	text-shadow: 0 0 8px rgba(32, 32, 32, .4);
+	-webkit-text-shadow: 0 0 8px rgba(32, 32, 32, .4);
+	-moz-text-shadow: 0 0 8px rgba(32, 32, 32, .4);
+	-webkit-transition: all 0.25s ease-in-out;
+	-moz-transition: all 0.25s ease-in-out;
+  	-o-transition: all 0.25s ease-in-out;
+	transition: all 0.25s ease-in-out;
+}
+
+h2 {
+	color:#000000;
+	font-size:15px;
+	font-family: 'Signika', sans-serif;
+	cursor:default;
+	text-shadow: 0 0 8px rgba(32, 32, 32, .4);
+	-webkit-text-shadow: 0 0 8px rgba(32, 32, 32, .4);
+	-moz-text-shadow: 0 0 8px rgba(32, 32, 32, .4);
+	-webkit-transition: all 0.25s ease-in-out;
+	-moz-transition: all 0.25s ease-in-out;
+  	-o-transition: all 0.25s ease-in-out;
+	transition: all 0.25s ease-in-out;
+}
+
+h1:hover {
+	color:#000000;
+	text-shadow: 0 0 28px rgba(255, 255, 255, .9);
+	-webkit-text-shadow: 0 0 28px rgba(255, 255, 255, .9);
+	-moz-text-shadow: 0 0 28px rgba(255, 255, 255, .9);
+}
+
+.IDiv {
+	padding:20px;
+	width:100%;
+	left:1%;
+	bottom:1%;
+	border:0px solid black;
+	float:left; 
+	position:absolute; 
+	z-index:1;
+	text-align:center;"
+}
+
+.LDiv {
+	padding:20px;
+	width:150px;
+	left:40px;
+	top:1%;
+	border:0px solid black;
+	float:left; 
+	position:absolute; 
+	z-index:1;
+	text-align:center;"
+}
+
+.TDiv {
+	width:40%;
+	z-index: 1;
+	padding:5px;
+	background-color: rgba(255, 255, 255, 0.8);
+	color:#000000;
+	font-size:20px;
+	font-family: 'Signika', sans-serif;
+	cursor:default;
+	border-radius: 100px;
+	-webkit-border-radius: 100px;
+	-moz-border-radius: 100px;
+	box-shadow: 0 0 8px rgba(32, 32, 32, .4);
+	-webkit-box-shadow: 0 0 8px rgba(32, 32, 32, .4);
+	-moz-box-shadow: 0 0 8px rgba(32, 32, 32, .4);
+	-webkit-transition: all 0.25s ease-in-out;
+	-moz-transition: all 0.25s ease-in-out;
+  	-o-transition: all 0.25s ease-in-out;
+	transition: all 0.25s ease-in-out;
+}
+
+.ODiv {
+	left:1%;
+	bottom:10%;
+	background-color: rgba(255, 255, 255, 0.4);
+	border:2px solid black;
+	float:left; 
+	position:absolute; 
+	z-index:10;
+	text-align:center;
+	border-radius: 10px;
+	-webkit-border-radius: 10px;
+	-moz-border-radius: 10px;
+	box-shadow: 0 0 18px rgba(0, 0, 0, .9);
+	-webkit-box-shadow: 0 0 18px rgba(0, 0, 0, .9);
+	-moz-box-shadow: 0 0 18px rgba(0, 0, 0, .9);
+	-webkit-transition: all 0.25s ease-in-out;
+	-moz-transition: all 0.25s ease-in-out;
+  	-o-transition: all 0.25s ease-in-out;
+	transition: all 0.25s ease-in-out;
+}
+
+.SDiv {
+	right:110px;
+	width:200px;
+	top:60%;
+	background-color: rgba(255, 255, 255, 0.8);
+	border:2px solid black;
+	float:right; 
+	position:absolute; 
+	z-index:1000;
+	text-align:center;
+	border-radius: 10px;
+	-webkit-border-radius: 10px;
+	-moz-border-radius: 10px;
+	box-shadow: 0 0 18px rgba(0, 0, 0, .9);
+	-webkit-box-shadow: 0 0 18px rgba(0, 0, 0, .9);
+	-moz-box-shadow: 0 0 18px rgba(0, 0, 0, .9);
+	-webkit-transition: all 0.25s ease-in-out;
+	-moz-transition: all 0.25s ease-in-out;
+  	-o-transition: all 0.25s ease-in-out;
+	transition: all 0.25s ease-in-out;
+}
+
+
+.GDiv {
+	right:20px;
+	width:400px;
+	top:20%;
+	background-color: rgba(255, 255, 255, 0.8);
+	border:2px solid black;
+	float:right; 
+	position:absolute; 
+	z-index:10;
+	text-align:center;
+	border-radius: 10px;
+	-webkit-border-radius: 10px;
+	-moz-border-radius: 10px;
+	box-shadow: 0 0 18px rgba(0, 0, 0, .9);
+	-webkit-box-shadow: 0 0 18px rgba(0, 0, 0, .9);
+	-moz-box-shadow: 0 0 18px rgba(0, 0, 0, .9);
+	-webkit-transition: all 0.25s ease-in-out;
+	-moz-transition: all 0.25s ease-in-out;
+  	-o-transition: all 0.25s ease-in-out;
+	transition: all 0.25s ease-in-out;
+}
+
+.EDiv {
+	left:6%;
+	width:400px;
+	top:2%;
+	background-color: rgba(255, 255, 255, 0.8);
+	border:2px solid black;
+	float:right; 
+	position:absolute; 
+	z-index:10;
+	text-align:center;
+	border-radius: 10px;
+	-webkit-border-radius: 10px;
+	-moz-border-radius: 10px;
+	box-shadow: 0 0 18px rgba(0, 0, 0, .9);
+	-webkit-box-shadow: 0 0 18px rgba(0, 0, 0, .9);
+	-moz-box-shadow: 0 0 18px rgba(0, 0, 0, .9);
+	-webkit-transition: all 0.25s ease-in-out;
+	-moz-transition: all 0.25s ease-in-out;
+  	-o-transition: all 0.25s ease-in-out;
+	transition: all 0.25s ease-in-out;
+}
+
+#chartdiv {
+	width		: 100%;
+	height		: 200px;
+	font-size	: 11px;
+}	
+
+.CImg {
+
+	border-radius: 10px;
+	background-color: #ffffff;
+	-webkit-border-radius: 10px;
+	-moz-border-radius: 10px;
+	box-shadow: 0 0 8px rgba(0, 0, 0, .8);
+	-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
+	-moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
+	-webkit-transition: all 0.25s ease-in-out;
+	-moz-transition: all 0.25s ease-in-out;
+  	-o-transition: all 0.25s ease-in-out;
+	transition: all 0.25s ease-in-out;
+	}				
+	
+.Crop {
+  max-width: 100px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}	
+
+.map-navigation-conatainer-l {
+    position: absolute;
+    width: 330px;
+	height: 95%;
+    top: 10px;
+    right: 10px;
+    padding: 10px;
+    z-index: 1;
+	text-align: center;
+}
+
+.map-navigation {
+    font: 12px/20px 'Helvetica Neue', Arial, Helvetica, sans-serif;
+    background-color: #ffffff;
+    opacity:0.90;
+    border-radius: 3px;
+    padding: 10px;
+    box-shadow:0 1px 2px rgba(0,0,0,0.20);
+}
+
+.map-navigation h2, .map-navigation p {
+    margin: 0 0 10px;
+}
+
+
+/* =============================
+Personal
+============================= */
+
+.CImg {
+	padding: 5px;
+	border-radius: 10px;
+	border-color: #ffffff #ffffff;
+	background-color: #ffffff;
+	-webkit-border-radius: 10px;
+	-moz-border-radius: 10px;
+	box-shadow: 0 0 8px rgba(0, 0, 0, .8);
+	-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
+	-moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
+	-webkit-transition: all 0.25s ease-in-out;
+	-moz-transition: all 0.25s ease-in-out;
+  	-o-transition: all 0.25s ease-in-out;
+	transition: all 0.25s ease-in-out;
+
+	}
+
+.CImgP {
+	padding: 2px;
+	border-radius: 10px;
+	border-color: #ffffff #ffffff;
+	background-color: #ffffff;
+	-webkit-border-radius: 10px;
+	-moz-border-radius: 10px;
+	box-shadow: 0 0 8px rgba(0, 0, 0, .8);
+	-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
+	-moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
+	-webkit-transition: all 0.25s ease-in-out;
+	-moz-transition: all 0.25s ease-in-out;
+  	-o-transition: all 0.25s ease-in-out;
+	transition: all 0.25s ease-in-out;
+
+	}
+	
+.BRnd {
+	padding: 4px;
+	border-radius: 50px;
+	-webkit-border-radius: 50px;
+	-moz-border-radius: 50px;
+	-webkit-transition: all 0.25s ease-in-out;
+	-moz-transition: all 0.25s ease-in-out;
+  	-o-transition: all 0.25s ease-in-out;
+	transition: all 0.25s ease-in-out;
+
+	}	
+	
+.Crop {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+	

Dash/Maps/js/MarkerOpacity.js

+
+/*
+* Extends L.Marker to include two extra methods: clusterHide and clusterShow.
+* 
+* They work as setOpacity(0) and setOpacity(1) respectively, but
+* they will remember the marker's opacity when hiding and showing it again.
+* 
+*/
+
+
+L.Marker.include({
+	
+	clusterHide: function () {
+		this.options.opacityWhenUnclustered = this.options.opacity || 1;
+		return this.setOpacity(0);
+	},
+	
+	clusterShow: function () {
+		var ret = this.setOpacity(this.options.opacity || this.options.opacityWhenUnclustered);
+		delete this.options.opacityWhenUnclustered;
+		return ret;
+	}
+	
+});
+
+

Dash/Maps/mSelectorFS.php

+<?php
+
+switch ($_GET["type"]) {
+    case "LVL":
+        $title = "Mapa de Instituciones que <span style='color: #006d00;'>han participado</span> / <span style='color: #FF0000;'>no han participado</span>";
+        break;
+    case "ANS":
+        $title = "Mapa de respuestas recibidas por Instituciones";
+        break;
+        
+    default:
+        $title = "Mapa";
+}
+    
+
+?>
+					<!-- Content Row -->
+					<div class="row">
+						<div class="col-xl-12 col-lg-12">						
+							<div class="card shadow mb-4">
+								<!-- Card Header - Dropdown -->
+								<div class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
+									<h6 class="m-0 font-weight-bold text-primary"><?php echo $title; ?></h6>
+								</div>
+								<!-- Card Body -->
+								<div class="card-body text-center">
+                                    <!-- Div de mapa -->
+                                    <iframe style="width:100%; height:70vh; border: 0;" frameBorder="0" src="<?php echo "Maps/".$_GET["type"].".php";?>"></div>
+								</div>
+							</div>
+						</div>
+					</div>
+
+