Demo - využití GPS

Po zadání adresy se zobrazí její GPS souřadnice a pomocí souřadnic je adresa zobrazena i na mapě.

Pro získání souřadnic slouží announce callback.

Zadejte adresu:

Zdrojový kód - HTML:

  
  <div>  
    <form>
  	<div>
  	    <label for="smartform_ulice">Ulice a číslo</label>
  	    <input id="smartform_ulice" type="text" class="smartform-street-and-number" />
  	</div>
  	<div>
  	    <label for="smartform_obec">Obec</label>
  	 	<input id="smartform_obec" type="text" class="smartform-city" />
  	</div>
  	<div>    
  	    <label for="smartform_psc">PSČ</label>
  	   	<input id="smartform_psc" type="text" class="smartform-zip" />
  	</div>
    </form>
    <div>
        <div id="gps"></div>
    </div>
</div>
<div id="mapa" style="width:430px; height:350px;"></div>
  

Zdrojový kód - JavaScript:

  
  <script type="text/javascript" src="https://secure.smartform.cz/api/v1/smartform.js" async></script>
<script type="text/javascript">
   
   var map;
   var markerLayer;
   var markers = [];	
   var coordinates = [];
   
   var smartform = smartform || {};
   
   smartform.beforeInit = function () {
   	smartform.setClientId('smartform');
   }
   smartform.afterInit = function () {
   	smartform.getInstance().addAnnounceCallback(announceCallback);
   }
   
   // callback pro vlastni reseni reakce na ziskani validni adresy
   function announceCallback(validationType, addressArray) {
   	if (validationType == smartform.ValidationResultType.HIT) {
   		clear();
   		var address = addressArray[0];
   		showAddress(address);
   	} else {
   		clear();
   	}
   }
   
   /** Zobrazeni adresy na mape */
   function showAddress(address) {
   	if( !address.GPS_LAT || !address.GPS_LONG) {
   		// nektere adresy nemaji ulozene souradice 
   		document.all.gps.outerHTML = "<div id=\"gps\">Pro tuto adresu nejsou GPS souřadnice k dispozici.</div>";  
   	} else {
   		// zobrazeni GPS vedle mapy    
   		document.all.gps.outerHTML = "<div id=\"gps\">GPS souřadnice:<br /> <div style=\"font-weight:bold; font-size:1.2em; margin-top:4px\">"+
   			format(address.GPS_LAT,address.GPS_LONG) +
   			"</div><div style=\"font-size:0.8em; margin-bottom:4px;\">"+round(address.GPS_LAT)+", "+round(address.GPS_LONG)+"</div></div>";
   		// zobrazeni na mape
   		showOnMap(address.GPS_LONG, address.GPS_LAT);
   		centerTheView();
   	}
   }
   
   /** Funkce na zaokrouhleni GPS souradnic. */
   function round(x) {
   	return Math.round(x*1000000)/1000000;
   }
   
   /** Vymazani mapy a souradnic. Vola se, pokud nebyla zadana validni adresa. */        
   function clear(){	
   	document.all.gps.outerHTML = "<div id=\"gps\"></div>";   
   	coordinates = [];
   	markerLayer.removeAll();
   	markers = [];
   } 
   /** Inicializace mapy */
   function initMap(){		
   	var origin = SMap.Coords.fromWGS84(15.5, 50);
   	map = new SMap(JAK.gel("mapa"), origin, 10);
   	map.addControl(new SMap.Control.Sync()); 
   	map.addDefaultLayer(SMap.DEF_BASE).enable();		
   	markerLayer = new SMap.Layer.Marker();
   	map.addLayer(markerLayer);
   	markerLayer.enable();		
   	map.addDefaultControls();
   }
   /** Spocitani pozici mapy tak, aby znacky byly videt */
   function centerTheView(){
   	var cz = map.computeCenterZoom(coordinates); /* Spočítat pozici mapy tak, aby značky byly vidět */
   	var last = cz.length-1;
   	map.setCenterZoom(cz[0], cz[last]); 
   }
   
   window.onload = function() {
   	prettyPrint();
   	initMap();
   }                                                     
   
   /** Prevedeni GPS souradnic z desetinneho formatu na zapis pomoci minut a sekund.
   * Napr.: (50.761701, 15.091974) -> 50°45'42.1''N 15°5'31.1''E     */
   function format(x, y) {        
   	var xx = convertCoord(x);
   	var yy = convertCoord(y);
   	return xx+"N&nbsp"+yy+"E";
   };
   
   /** Prevedeni jedne souradnice */  
   function convertCoord(dD) {
   	var D = Math.floor(dD);
   	var dM = (dD-D)*60;
   	var M = Math.floor(dM); 
   	var S = Math.round((dM-M)*600)/10;
   	return D+"&deg"+M+"\'"+S+"\'\'";        
   }
   
   
   /** Zobrazeni souradnic na mape */
   function showOnMap(lonD, latD) { 
   	var coords = SMap.Coords.fromWGS84(lonD, latD); /* Souřadnice značky, z textového formátu souřadnic */
   
   	var options = {
   		anchor: {left:10, bottom: 1}  /* Ukotvení značky za bod uprostřed dole */
   	}
   
   	var marker = new SMap.Marker(coords, null, options);
   	coordinates.push(coords);
   	markers.push(marker);
   						
   	for (var i=0;i<markers.length;i++) {
   		markerLayer.addMarker(markers[i]);
   	}
   	
   }
   
   
   /** Reset testovaciho formulare */
   function clearForm(){
   	$("#smartform_ulice").val("");
   	$("#smartform_obec").val("");
   	$("#smartform_psc").val("");
   	
   	initMap();
   	// reset smartformu
   	smartform.rebindAllForms(false, function () {
   	// done-callback:
   	$("#smartform_ulice").focus();
   	smartform.getInstance().addAnnounceCallback(announceCallback);
   	} );
	}
  </script>
  

Hlavní navigace: