Migración a Bootstrap 4
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

69 lines
2.3KB

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset=utf-8 />
  5. <title>Display latitude longitude on marker movement</title>
  6. <script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
  7. <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
  8. <style>
  9. body { margin:0; padding:0; }
  10. #map {width: 100%;height: 280px;}
  11. </style>
  12. </head>
  13. <body onload="javascript:window.parent.document.getElementById('<?php echo $_REQUEST[id]?>').value= '';">
  14. <div id='map'></div>
  15. <?php
  16. if ($_REQUEST[lat] !='') {$lat=$_REQUEST[lat];}else {$lat= "-75.5570125579834";}
  17. if ($_REQUEST[lon] !='') {$lon=$_REQUEST[lon];}else {$lon= "6.2463742841860";}
  18. if ($_REQUEST[zoom] !='') {$zoom=$_REQUEST[zoom];}else {$zoom= "16";}
  19. ?>
  20. <script>
  21. var map = L.map('map').setView([<?php echo $lon ?>, <?php echo $lat ?>], <?php echo $zoom ?>);
  22. L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
  23. function onLocationFound(e) {
  24. var radius = e.accuracy / 2;
  25. <?php if ($_REQUEST[lat] =='') {
  26. echo "var marker = L.marker(e.latlng,{draggable: true}).addTo(map);";
  27. }else{
  28. echo "var marker = L.marker([$lon,$lat],$zoom,{draggable: true}).addTo(map);";
  29. } ?>
  30. marker.on('dragend', ondragend);
  31. ondragend();
  32. function ondragend() {
  33. var m = marker.getLatLng();
  34. var z = map.getZoom();
  35. // window.parent.document.getElementById('<?php echo $_REQUEST[id]?>').value= m.lng+' '+m.lat+' '+z;
  36. window.parent.document.getElementById('<?php echo $_REQUEST[id]?>').value= m.lng+' '+m.lat+' '+z;
  37. }
  38. }
  39. function onLocationError(e) {
  40. var marker = L.marker([<?php echo $lon ?>,<?php echo $lat ?>],{draggable: true}).addTo(map);
  41. marker.on('dragend', ondragend);
  42. ondragend();
  43. function ondragend() {
  44. var m = marker.getLatLng();
  45. var z = map.getZoom();
  46. // window.parent.document.getElementById('<?php echo $_REQUEST[id]?>').value= m.lng+' '+m.lat+' '+z;
  47. window.parent.document.getElementById('<?php echo $_REQUEST[id]?>').value= m.lng+' '+m.lat+' '+z;
  48. }
  49. }
  50. map.on('locationfound', onLocationFound);
  51. map.on('locationerror', onLocationError);
  52. map.locate({setView: true, maxZoom: 18});
  53. </script>
  54. <input id="campo" value='hola'>
  55. </body>
  56. </html>