PHP 656
Pare! By Guest on 2nd August 2019 06:02:51 AM
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.   <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  5.   <title></title>
  6.   <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  7.   <meta name="robots" content="noindex, nofollow">
  8.   <meta name="googlebot" content="noindex, nofollow">
  9.   <meta name="viewport" content="width=device-width, initial-scale=1">
  10.  
  11.     <link rel="stylesheet" type="text/css" href="result-light.css">
  12. <?php /*
  13.       <script type="text/javascript" src="https://unpkg.com/leaflet@1.0.3/dist/leaflet.js"></script>
  14.       <link rel="stylesheet" type="text/css" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css">
  15.       <script type="text/javascript" src="https://unpkg.com/leaflet-geosearch@2.2.0/dist/bundle.min.js"></script>
  16. */ ?>
  17.  
  18.  
  19.  
  20.       <script type="text/javascript" src="leaflet-src.js"></script>
  21.       <link rel="stylesheet" type="text/css" href="leaflet.css">
  22.       <script type="text/javascript" src="bundle.min.js"></script>
  23.      
  24.  
  25.   <style id="compiled-css" type="text/css">
  26.       #map {
  27.   width: 600px;
  28.   height: 400px;
  29. }
  30.  
  31.   </style>
  32.  
  33.  
  34.   <!-- TODO: Missing CoffeeScript 2 -->
  35.  
  36.   <script type="text/javascript">
  37. //<![CDATA[
  38.  
  39.     window.onload=function(){
  40.      
  41.  
  42.  
  43.     }
  44.  
  45. //]]></script>
  46.  
  47. </head>
  48. <body>
  49.     <title>Geosearch + marker example</title>
  50. <!--  Leaflet CSS  -->
  51. <body>
  52.        
  53.        
  54.        
  55.         <script language="javascript" type="text/javascript">
  56.  
  57. var map;
  58.  
  59. function DelayedSubmission(address) {
  60.         addr = address ;
  61.         console.log("DeSub: "+ addr) ;
  62.     var date = new Date();
  63.     initial_time = date.getTime();
  64.     if (typeof setInverval_Variable == 'undefined') {
  65.             setInverval_Variable = setInterval(DelayedSubmission_Check, 50);
  66.     }
  67. }
  68.  
  69. function DelayedSubmission_Check() {
  70.     var date = new Date();
  71.     check_time = date.getTime();
  72.     var limit_ms=check_time-initial_time;
  73.     if (limit_ms > 800) { //Change value in milliseconds
  74.       //  alert("insert your function ktbr.., "); //Insert your function
  75.       console.log("da alert"+ addr) ;
  76.       genmap(addr) ;
  77.         clearInterval(setInverval_Variable);
  78.         delete setInverval_Variable;
  79.     }
  80. }
  81.  
  82.  
  83. </script>
  84.  
  85. <input type="search" onkeyup="DelayedSubmission(this.value)" id="field_id" style="WIDTH: 100px; HEIGHT: 25px;" />
  86.  
  87.  
  88. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Ακαδημίας
  89. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Ακαδημίας 100
  90. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Ακαδημίας 10
  91.        
  92.        
  93.        
  94.        
  95.        
  96. <hr /> 
  97.        
  98.   <div id="map"></div>
  99.  
  100.  
  101.   <script>
  102.          
  103. function initMap(){
  104.         // Initialize map to specified coordinates
  105.     var map = L.map('map', {
  106.       center: [21.5, -0.1], // CAREFULL!!! The first position corresponds to the lat (y) and the second to the lon (x)
  107.       zoom: 15
  108.     });
  109.  
  110.     // Add tiles (streets, etc)
  111.     L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  112.       attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>',
  113.       subdomains: ['a', 'b', 'c']
  114.     }).addTo(map);
  115.     return map;
  116. }
  117.            
  118.                 var mapinit = 0;
  119.                
  120. function genmap(addr) {
  121.        
  122.                 console.log(typeof map) ;
  123.     if( mapinit === 0 ){
  124.                 var map = initMap();
  125.                 mapinit = 1;
  126.        console.log("NEW MAP init") ;
  127.         } else {
  128.                 console.log("NO NEW MAP!" ) ;
  129.           group.clearLayers();
  130.         }
  131.  
  132. //n/    var query_addr = "99 Southwark St, London SE1 0JF, UK";
  133.   //  var query_addr = "Ακαδημίας 100";
  134.     var query_addr = addr;
  135.  
  136.     // Get the provider, in this case the OpenStreetMap (OSM) provider. For some reason, this is the "wrong" way to instanciate it. Instead, we should be using an import "leaflet-geosearch" but I coulnd't make that work
  137.     const provider = new window.GeoSearch.OpenStreetMapProvider()
  138.     var query_promise = provider.search({
  139.       query: query_addr
  140.     });
  141.     // It's a promise because we have to wait for the geosearch results. It may be more than one. Be careful.
  142.     // These results have the following properties:
  143.     // const result = {
  144.     //   x: Number,                      // lon,
  145.     //   y: Number,                      // lat,
  146.     //   label: String,                  // formatted address
  147.     //   bounds: [
  148.     //     [Number, Number],             // s, w - lat, lon
  149.     //     [Number, Number],             // n, e - lat, lon
  150.     //   ],
  151.     //   raw: {},                        // raw provider result
  152.     // }
  153.  
  154.  
  155.     query_promise.then(value => {
  156.           var markerArray = [];
  157.       for (i = 0; i < value.length; i++) {
  158.         // Success!
  159.         var x_coor = value[i].x;
  160.         var y_coor = value[i].y;
  161.        
  162.         console.log("CORDS: x: "+ x_coor+"  y: "+y_coor + " i:" + value.length) ;
  163.         var label = value[i].label;
  164.         var marker = L.marker([y_coor, x_coor]).addTo(map) // CAREFULL!!! The first position corresponds to the lat (y) and the second to the lon (x)
  165.        
  166.        
  167.         marker.bindPopup("<b>Found location</b><br>" + label).openPopup(); // note the "openPopup()" method. It only works on the marker
  168.        
  169.        markerArray.push(L.marker([y_coor, x_coor]));
  170.        
  171.       };
  172.      
  173.       group = L.featureGroup(markerArray) ;
  174.       map.fitBounds(group.getBounds());
  175.        
  176.      
  177.     }, reason => {
  178.       console.log(reason); // Error!
  179.     });
  180.  
  181.  
  182. }
  183.  
  184.   </script>
  185.  
  186.  
  187.  
  188.  
  189.  
  190.  
  191.  
  192. </body>
  193. </html>

Paste is for source code and general debugging text.

Login or Register to delete or keep track of your pastes.

Recent Pastes

Looking for sex

Free cam2cam sex

Moldova ladies

LTC BCH Android[...]

BTC LTC DOGE DASH[...]

ООО[...]

I am looking for a[...]

DebFed

Untitled

Untitled

Copyright © 2020 Paste. All rights reserved.
;)