MAPA - GEOCODER Se agrego un geocoder al campo mapa, por el cual se puede buscar directamente en la DB de OSM, también se corrigió BUG en la georeferencia de imagenes

This commit is contained in:
fredyrivera 2015-11-15 16:40:23 -05:00
parent a916eb776e
commit a6e5c226c3
3 changed files with 137 additions and 7 deletions

View File

@ -1,6 +1,59 @@
<?php <?php
date_default_timezone_set('America/Bogota'); date_default_timezone_set('America/Bogota');
function geocoder($valor,$campo){
$respuesta = new xajaxResponse('utf-8');
if(strlen($valor) > 3) {
$valor = urlencode($valor);
$json = "https://nominatim.openstreetmap.org/search.php?format=json&limit=5&addressdetails=1&q=$valor";
$data = file_get_contents("$json");
$geocoder = json_decode($data, true);
if($data ==="[]") {$vacio="
<a class='pull-right' onclick=\"xajax_limpia_div('muestra_geocoder'); \"><i class='fa fa-times-circle-o'></i></a>
<strong class='text-danger center'><i class='fa fa-exclamation-triangle'></i> No se encontraron resultados</strong>
";}
foreach ($geocoder as $clave => $valor) {
$ciudad = $valor['address']['city'];
$municipio = $valor['address']['town'];
$pais = $valor['address']['country'];
$departamento = $valor['address']['state'];
$licencia= $valor['licence'];
$link = "$_SESSION[url]mapero.php?lat=$valor[lon]&lon=$valor[lat]&zoom=16&id=$campo";
$linea .= "
<div onclick=\" xajax_limpia_div('muestra_geocoder'); document.getElementById('mapita').src='$link'; \" style='padding:5px; border-radius: 3px;margin:5px;border: 1px solid gray; background-color : white;'>
<ul class='list-unstyled' >
<li><strong>$valor[display_name]</strong></li>
<!-- <li>Lat: $valor[lat] lon $valor[lon]</li> -->
<li><image src='$valor[icon]' > $ciudad $municipio $pais $departamento</li>
</ul>
</div>
";
//foreach ($valor as $clave => $valor) { $linea .= "CLAVE : $clave > VALOR: $valor"; }
}
$resultado = " <div style='width: 100%;'>
<a class='pull-right' onclick=\"xajax_limpia_div('muestra_geocoder'); \">Cerrar <i class='fa fa-times-circle-o'></i></a>
<br>
$linea
</div>
<div class='text-center ' style='padding:5px; padding:5px; border-radius: 3px;margin:5px;border: 1px solid gray; background-color : white;'>
<small>$vacio $licencia</small>
</div>";
}
//$div_contenido = "<div id='$div'>$div</div>";
//$respuesta->addAssign("muestra_form","innerHTML","$aviso");
//$respuesta->addAssign("titulo_modal","innerHTML","Hola mundo");
//$respuesta->addAssign("pie_modal","innerHTML","$pie");
$respuesta->addAssign("muestra_geocoder","innerHTML","$resultado");
//$respuesta->addscript("$('#muestraInfo').modal('toggle')");
return $respuesta;
}
$xajax->registerFunction("geocoder");
function mostrar_psi(){ function mostrar_psi(){
$respuesta = new xajaxResponse('utf-8'); $respuesta = new xajaxResponse('utf-8');
include("psi.php"); include("psi.php");
@ -2276,7 +2329,7 @@ $campo_imagen = $campo_imagen[0];
if ($campo_imagen[0] != "") { if ($campo_imagen[0] != "") {
$subir_imagen = subir_imagen('',"$campo_imagen"."[0]"); $subir_imagen = subir_imagen("$perfil","$campo_imagen"."[0]");
if($tipo != "campos") { if($tipo != "campos") {
$imagen = " $imagen = "
<div class='form-group' id='input_".$campo_imagen."[0]' > <div class='form-group' id='input_".$campo_imagen."[0]' >
@ -4549,6 +4602,8 @@ function subir_imagen($respuesta,$id){
///vinculado con la funcion de javascript resultadoUpload(estado, file) que esta en librerias/scripts.js ///vinculado con la funcion de javascript resultadoUpload(estado, file) que esta en librerias/scripts.js
//this.form.taget= 'ventana'; this.form.action = 'destinoEspecial.html'; this.form.submit()" //this.form.taget= 'ventana'; this.form.action = 'destinoEspecial.html'; this.form.submit()"
$javascript="$_SESSION[url]/includes/upload.php"; $javascript="$_SESSION[url]/includes/upload.php";
$campo_mapa = buscar_campo_tipo($respuesta,"14");
$campo_mapa = $campo_mapa[0];
if ($id ==''){$id='imagen';} if ($id ==''){$id='imagen';}
$size = ($_SESSION[upload_size]*1024*1024)." bytes"; $size = ($_SESSION[upload_size]*1024*1024)." bytes";
$resultado .=" $resultado .="
@ -4557,6 +4612,7 @@ $resultado .="
action= $javascript action= $javascript
target='iframeUpload' class='form-horizontal' name='subir_imagen_$id' id='subir_imagen_$id'> target='iframeUpload' class='form-horizontal' name='subir_imagen_$id' id='subir_imagen_$id'>
<input type='hidden' id='id_imagen' name='id_imagen' value='$id'> <input type='hidden' id='id_imagen' name='id_imagen' value='$id'>
<input type='hidden' id='campo_mapa' name='campo_mapa' value='$campo_mapa'>
<input class='form-control' name='fileUpload' type='file' onchange=\"this.form.taget= 'iframeUpload'; this.form.action = '$javascript';this.form.submit();\" /> <input class='form-control' name='fileUpload' type='file' onchange=\"this.form.taget= 'iframeUpload'; this.form.action = '$javascript';this.form.submit();\" />
<iframe name='iframeUpload' style='display:none' ></iframe> <iframe name='iframeUpload' style='display:none' ></iframe>
<div class='alert alert-info text-center' id='formUpload'>La imagen debe estar en formato .jpg y de tamaño m&aacute;ximo $_SESSION[upload_size] MB ( $size)</div> <div class='alert alert-info text-center' id='formUpload'>La imagen debe estar en formato .jpg y de tamaño m&aacute;ximo $_SESSION[upload_size] MB ( $size)</div>
@ -6491,9 +6547,19 @@ $consulta ="
} }
$render .= " $render .= "
<div style='position:relative'>
<div class='input-group'>
<input placeholder='El libano, tolima, colombia' type='text' class='form-control' id='geocoder_".$id_campo."[".$item."]'>
<span class='input-group-btn'>
<div class='btn btn-default' onclick=\"xajax_geocoder((document.getElementById('geocoder_".$id_campo."[".$item."]').value),'".$id_campo."[".$item."]'); \" ><i class='fa fa-search'></i></div>
</span>
</div>
<iframe id='mapita' src='$_SESSION[url]mapa.php?lat=$lat&lon=$lon&zoom=$zoom&id=".$id_campo."[".$item."]' width='100%' height='300px'></iframe> <div id='muestra_geocoder' style='position:absolute; max-height: 300px; width: 90%; overflow-y:auto; '></div>
<input value='$value' type='text' id='".$id_campo."[".$item."]' name='".$id_campo."[".$item."]' class='form-control' placeholder='coordenadas' readonly > </div>
<iframe id='mapita' src='$_SESSION[url]mapa.php?lat=$lat&lon=$lon&zoom=$zoom&id=".$id_campo."[".$item."]' width='100%' height='300px'></iframe>
<input value='$value' type='text' id='".$id_campo."[".$item."]' name='".$id_campo."[".$item."]' class='form-control' placeholder='coordenadas' readonly >
"; ";
$cols='12'; $cols='12';
@ -7148,7 +7214,7 @@ $campo_imagen = $campo_imagen[0];
if ($campo_imagen[0] != "") { if ($campo_imagen[0] != "") {
$subir_imagen = subir_imagen('',"$campo_imagen"."[0]"); $subir_imagen = subir_imagen("$id","$campo_imagen"."[0]");
} }
$muestra_form = " $muestra_form = "
<div id ='div_$control' class='' > <div id ='div_$control' class='' >

View File

@ -31,7 +31,13 @@ $name = MD5(time())."$ext";
$nombre= "$_SESSION[path_images_secure]/full/".$name; $nombre= "$_SESSION[path_images_secure]/full/".$name;
$imagenX = $_FILES[fileUpload][tmp_name]; $imagenX = $_FILES[fileUpload][tmp_name];
$coordenadas = leer_exif($imagenX); $coordenadas = leer_exif($imagenX);
if($coordenadas !='') { $alerta = "alert('Se han detectado coordenadas en los metadatos de la imagen y se ubicará el mapa en ese lugar.');";} //$link = "$_SESSION[url]mapero.php?lat=$coordenadas[lon]&lon=$coordenadas[lat]&zoom=16&id=$name";
if($coordenadas !='') {
$coordenadas = "$coordenadas"."&id=$_REQUEST[campo_mapa]"."[0]";
$alerta = "alert(' Se han detectado coordenadas en los metadatos de la imagen y se ubicará el mapa en ese lugar.');";
}
//if (!copy($_FILES['fileUpload']['tmp_name'],"$nombre")) //if (!copy($_FILES['fileUpload']['tmp_name'],"$nombre"))
if (!move_uploaded_file($_FILES['fileUpload']['tmp_name'],$nombre)) if (!move_uploaded_file($_FILES['fileUpload']['tmp_name'],$nombre))
//move_uploaded_file($tmp_name, "$uploads_dir/$name"); //move_uploaded_file($tmp_name, "$uploads_dir/$name");
@ -96,7 +102,7 @@ if ( !empty($exif['GPSLongitude']) && !empty($exif['GPSLatitude']) ) {
if ( $exif['GPSLatitudeRef'] == 'S') if ( $exif['GPSLatitudeRef'] == 'S')
$gps_latitude = -$gps_latitude; $gps_latitude = -$gps_latitude;
if($gps_latitude !='') { if($gps_latitude !='') {
$resultado = "$_SESSION[url]/mapa.php?lon=$gps_latitude&lat=$gps_longitude&zoom=18"; $resultado = "$_SESSION[url]mapero.php?lon=$gps_latitude&lat=$gps_longitude&zoom=18";
}else{$resultado ="";} }else{$resultado ="";}
//$resultado = "$gps_longitude $gps_latitude"; //$resultado = "$gps_longitude $gps_latitude";

58
milfs/mapero.php Normal file
View File

@ -0,0 +1,58 @@
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Mapero</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.css" />
<style>
body { margin:0; padding:0; }
#map {width: 100%;height: 280px;}
</style>
</head>
<body>
<div id='map'></div>
<?php
if ($_REQUEST[lat] !='') {$lat=$_REQUEST[lat];}else {$lat= "-75.5570125579834";}
if ($_REQUEST[lon] !='') {$lon=$_REQUEST[lon];}else {$lon= "6.2463742841860";}
if ($_REQUEST[zoom] !='') {$zoom=$_REQUEST[zoom];}else {$zoom= "16";}
?>
<script>
var map = L.map('map')
.setView([<?php echo $lon ?>, <?php echo $lat ?>], <?php echo $zoom ?>);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
//var lat = window.parent.document.getElementById('lat');
//var lng = window.parent.document.getElementById('lon');
var mapa = window.parent.document.getElementById('<?php echo $_REQUEST[id]?>');
var marker = L.marker([<?php echo $lon ?>,<?php echo $lat ?>],{draggable: true}).addTo(map);
// every time the marker is dragged, update the coordinates container
marker.on('dragend', ondragend);
// Set the initial marker coordinate on load.
ondragend();
function ondragend() {
var m = marker.getLatLng();
var z = map.getZoom();
// lat.value= m.lat;
// lng.value= m.lng;
mapa.value= m.lng+' '+m.lat+' '+z;
}
</script>
</body>
</html>