Mapa Google - pobieranie danych z bazy

0

Witam serdecznie przerobiłem sobie skrypt by pobierał mi dane z bazy danych:

<html xmlns="http://www.w3.org/1999/xhtml">      
    <head>      
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />      
         <title>Mapka próbna...</title>    
        <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>    
    </head>      
    <body onload="mapaStart()">      
		<script type="text/javascript">   
		
		var mapa;
		var dymek = new google.maps.InfoWindow(); // zmienna globalna
		
		function dodajMarker(lat,lng,txt)
		{
			// tworzymy marker
			var opcjeMarkera =   
			{  
				position: new google.maps.LatLng(lat,lng),  
				map: mapa
			}  
			var marker = new google.maps.Marker(opcjeMarkera);
			marker.txt=txt;
			
			google.maps.event.addListener(marker,"click",function()
			{
				dymek.setContent(marker.txt);
				dymek.open(mapa,marker);
			});
			return marker;
		}
		
		function mapaStart()   
		{   
			var wspolrzedne = new google.maps.LatLng(52.04, 19.28);
			var opcjeMapy = {
			  zoom: 6,
			  center: wspolrzedne,
			  mapTypeId: google.maps.MapTypeId.ROADMAP
			};
			
			mapa = new google.maps.Map(document.getElementById("mapka"), opcjeMapy);
			<?php
$db = new mysqli('localhost', 'lopa', '', 'dane');
$db -> query("SET CHARSET utf8");
$db -> query("SET NAMES 'UTF-8' COLLATE 'utf8_polish_ci'");
$zapytanie = "SELECT * FROM geolokalizacja";
$wynik = $db->query($zapytanie);
$w=1;

	while ($baza = $wynik->fetch_assoc())
	
{ echo("var marker".$w++." = dodajMarker(".$baza['Lat'].",".$baza['Lng'].",'".$baza['nazwa']."'); "); }



 ?>
 
 
 
 
 
 }   
		</script>   
		

		
		
		<div id="mapka" style="width: 100%; height: 500px; border: 1px solid black; background: gray;">
		<!-- tu będzie mapa -->   
		</div>   
		<p id="info">
			Wiele markerów, każdy z własnym opisem.
		</p>
    </body>      
</html>  

I wszystko super się wyświetla tylko mam problem z napisami w chmurce. Mianowicie jak w bazie mam np. baza['nazwa']='FIRMA XYZ' To w chmurce mi wyświetla tylko FIRMA zamiast FIRMA XYZ Po prostu jak jest spacja to do spacji wyświetli wszystko a po już nie wyświetla... w czym może być problem ??

0

generalnie - debuguj

  1. sprawdź produkowany kod
  2. używaj console.log

ja zakładam problem po stronie funkcji dodajMarker - czy jak ręcznie podasz jej nazwę ze spacją, to działa, czy nie?

wrzucając posty staraj się robić to tak, żebym mógł błąd powtórzyć u siebie - czytanie kodu to często za mało. więc:

  1. albo przerabiasz kod tak, żeby nie było korzystania z bazy (tylko na sztywno stwórz arraye z danymi)
  2. albo wrzucasz też zrzut tabel/i z bazy

jeżeli problem nie dotyczy w ogóle strony serwerowej to wywalasz cały kod php i wrzucasz już wygenerowaną odpowiedź od serwera na coś w stylu http://jsbin.com/

0

O dziwo odkryłem, że jak dokleję jakiś tekst do zmiennej np:
{ echo("var marker".$w++." = dodajMarker(".$baza['Lat'].",".$baza['Lng'].",'NAZWA FIRMY:
".$baza['nazwa'].'"'); "); }

To $baza['nazwa'] wyświetla mi się poprawnie obojętnie ile jest spacji w nazwie... ot taki chochlik... wink.gif

Ale chciałem dodać sobie teraz by z bazy mi pobierało załóżmy jaka ma być ikona: ikona1, ikona2, ikona3

I teraz kod już bez bazy gotowy do odpalenia...:

<html xmlns="http://www.w3.org/1999/xhtml">      
    <head>      
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />      
         <title>Mapka próbna...</title>    
        <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>    
    </head>      
    <body onload="mapaStart()">      
		<script type="text/javascript">   
		
		var mapa;
		var dymek = new google.maps.InfoWindow();
    

		function dodajMarker(lat,lng,txt,ico)
		{
			// tworzymy marker
			var opcjeMarkera =   
			{  
				position: new google.maps.LatLng(lat,lng),  
				map: mapa
			
			}  
			var marker = new google.maps.Marker(opcjeMarkera);
			marker.txt=txt;
			
			google.maps.event.addListener(marker,"click",function()
			{
				dymek.setContent(marker.txt);
				dymek.open(mapa,marker);
			});
			
		var ikona1 = new google.maps.MarkerImage("http://maps.google.com/mapfiles/kml/pal2/icon38.png");
        var ikona2 = new google.maps.MarkerImage("http://maps.google.com/mapfiles/kml/pal4/icon23.png");
		var ikona3 = new google.maps.MarkerImage("http://maps.google.com/mapfiles/kml/pal3/icon13.png");
             
			
			return marker;
		}
		
		function mapaStart()   
		{   
			var wspolrzedne = new google.maps.LatLng(52.04, 19.28);
			var opcjeMapy = {
			  zoom: 6,
			  center: wspolrzedne,
			  mapTypeId: google.maps.MapTypeId.ROADMAP
			};
			
			mapa = new google.maps.Map(document.getElementById("mapka"), opcjeMapy);


				
				
				
				
		var marker1 = dodajMarker(53.439068183003684,14.518346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA A <br /> 53.439068183003684', ikona1); 
		var marker2 = dodajMarker(53.42235902258507,14.489099979400635,'<strong>NAZWA FIRMY:</strong><br /> FIRMA B <br /> 53.42235902258507', ikona2); 
		var marker3 = dodajMarker(54.439068183003684,15.518346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_AD <br /> 54.439068183003684', ikona3); 
		var marker4 = dodajMarker(52.439068183003684,18.518346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_ADS <br /> 52.439068183003684',  ikona3);
 
 
 
 
 
 }   
		</script>   
			
		<div id="selektor" style="width: 100%; height: 50px;  background: green;">
		TUTAJ BĘDĄ POLA SELEKCJI 
		</div> 
		
		<div id="mapka" style="width: 100%; height: 500px;">
		<!-- tu będzie mapa -->   
		</div>   
		<p id="info">
			Wiele markerów, każdy z własnym opisem i inną ikoną.
		</p>
    </body>      
</html>   

Nie znam się na JavaScript także nie bijcie po oczach ;)

1

jakiś powód tego był, ale ciężko teraz określić jaki..

czy ta ikona na koncu to nie powinien być string?
jak chcesz potem wyszukiwać adresu takiej ikony w dodajMarker to sobie zdefiniuj to jako obiekt:

var ikony = {
  ikona1: 'http://aaa.jpg',
  ikona2: 'http://aaa.jpg',
};

var adres_ikony = 'http://ikonkadomyslna.jpg';
if (ikony.hasOwnProperty(ico)) {
  adres_ikony = ikony[ico];
}

alert(adres_ikony);
0

Dzięki już to ogarnąłem ;) A jeszcze pytanie mam taki problem.... mam w bazie teraz ponad 200 firm gdzie mam podane [nazwa][kod][miasto][ulica+numer][telefon][mail] i teraz jak wrzucę to w skrypt który geokoduje mi na podstawie miasta, ulicy no to tak 8 może więcej poprawnie mi naniesie a potem dostaje bloka od google ;) no bo za dużo podejrzewam chcę adresów geokodować... i teraz pytanie czy istnieje jakiś szybki sposób by geokodować adresy i zapisać do bazy współrzędne markera którego się udało zgeokodować i jak mniej więcej to zrobić bo ustawić marker na podstawie adresu potrafię tylko nie wiem jak pobrać jego współrzędne by móc potem zapisać do bazy??

1

nie wiem czy google maps ma jakieś serwerowe api - jeżeli ma - to sobie zrób to od razu po stronie serwera.
jeżeli nie ma, to napisz sobie funkcję, która po zdekodowaniu wyśle tę informację do serwera ajaxem*, a ten sobie to zapisze i następnym razem wyśle dodatkowe info, już odnalezione.
możesz też nie próbować używać wyszukiwania wg adresu 100 razy na sekundę, tylko użyć jakiegoś setInterval/setTimeout żeby opóźniać zapytania.

* - tu musisz uważać, bo złośliwy user (wątpię, że się zdarzy, ale MOŻE) może zobaczyć, że coś takiego robisz i pchać Ci do serwera fałszywe informacje. nie wiem jak działa strona, którą robisz, ale jeżeli dodawanie tych miejsc wykonuje się w jakimś panelu administracyjnym, a server-side'owego maps api nie ma - to właśnie w panelu zrób sobie to geokodowanie, żeby nie musieć polegać na danych od użytkowników strony

0

Dzięki za wskazówki ja robię stronę dla siebie jestem przedstawicielem a z informatyką mam tyle wspólnego co nic ;) i tak się zawziąłem w sobie z 2 miesiące temu od podstaw kursów na youtube i tak dłubię zresztą zobacz mój pierwszy post w tym temacie tak się chyba nie pisze programów ale działa że wyniki dla JS zwracam pętlą w php ;) ale do rzeczy chcę sobie zrobić stronkę z punktami na mapie punkty odwiedzone i nieodwiedzone... Prosta strona żaden ze mnie programista... Dzięki Tobie już zrobiłem sobie stronę wyciągającą firmy (moi potencjalni klienci) np. z PKT.pl;) i teraz chcę to zaprząc do mapy i po kolei odwiedzać a co...

A wracając do tematu zmodziłem coś takiego może komuś się przyda...:

 
    <?php
    $googlezap = 'http://maps.google.com/maps/api/geocode/json?address=Katowice+Warszawska+4&sensor=false&region=PL';
           $strona = file_get_contents($googlezap);
           $tablica = json_decode($strona,true);


		   
		   echo ($tablica['results'][0]['geometry']['location']['lat'].'<br />');
		   echo ($tablica['results'][0]['geometry']['location']['lng']);
		   


    ?>

Teraz pytanie czy google od razu mi umożliwi i przekształci mi te 200wyników na współrzędne czy będę musiał wykonywać to czasowo tak jak pisałeś w poprzednim poście... ale jakby co to jest sleep() najprościej chyba jak się da hahaha ale z miłą chęcią przestudiuję Twoje rozwiązanie...

I drugie pytanie jeśli chodzi o adres jaką ma prawidłową postać w zapytaniu dla google??
address=Katowice+Warszawska+4
czy może
address=Warszawska+4+Katowice+Polska

czyli nazwa miejscowości, ulica oraz numer budynku...?

EDIT:
Spokojnie można wykonać 200 zapytań na raz musiałem tylko ustawić set_time_limit(0) czytałem że jest ograniczenie do 16.000 dziennie ale nie wiem czy dotyczy właśnie tego... Ładnie mi wyrzuca współrzędne dla wszystkich pozycji... dla nie których nie znalazł ale przynajmniej dla większości wypluwa poprawny ;) teraz tylko zapis do bazy zrobić ;) Ale moje pytanie odnośnie poprawności adresu dla google nadal pozostaje aktualne...

EDIT2:
Chciałem sobie dodać znalazłem taką fajną funkcję MarkerCluster ale chyba jakiś błąd robię bo niestety nie wyświetla mi klastrów ani markerów... :/

 <code class="php">
<html xmlns="http://www.w3.org/1999/xhtml">      
    <head>      
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />      
         <title>Mapka próbna...</title>    
        <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>  
		<script src="script/markerclusterer.js" type="text/javascript"></script>		
    </head>      
    <body onload="mapaStart()">      
		<script type="text/javascript">   
		
		var mapa;
		var dymek = new google.maps.InfoWindow();
		var markerCluster;
	
    

		function dodajMarker(lat,lng,txt)
		{
			// tworzymy marker
			var opcjeMarkera =   
			{  
				position: new google.maps.LatLng(lat,lng),  
				map: mapa
			
			}  
			var marker = new google.maps.Marker(opcjeMarkera);
			marker.txt=txt;
			
			google.maps.event.addListener(marker,"click",function()
			{
				dymek.setContent(marker.txt);
				dymek.open(mapa,marker);
			});
			
			return marker;
		}
		
		function mapaStart()   
		{   
			var wspolrzedne = new google.maps.LatLng(52.04, 19.28);
			var opcjeMapy = {
			  zoom: 6,
			  center: wspolrzedne,
			  mapTypeId: google.maps.MapTypeId.ROADMAP
			};
			
			mapa = new google.maps.Map(document.getElementById("mapka"), opcjeMapy);
			markerCluster = new MarkerCluster(mapa);

				
				
				
			var marker1 = dodajMarker(53.439068183003684,14.518346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA A<br/>53.439068183003684');
			var marker2 = dodajMarker(53.42235902258507,14.489099979400635,'<strong>NAZWA FIRMY:</strong><br /> FIRMA B<br/>53.42235902258507');
			var marker3 = dodajMarker(54.439068183003684,15.518346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_AD<br/>54.439068183003684');
			var marker4 = dodajMarker(52.439068183003684,18.518346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_ADS<br/>52.439068183003684');
			var marker5 = dodajMarker(52.139068183003684,18.118346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_ADS1<br/>52.139068183003684');
			var marker6 = dodajMarker(51.139068183003684,18.118346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_ADS12<br/>51.139068183003684');
			var marker7 = dodajMarker(51.339068183003684,18.318346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_ADS123<br/>51.339068183003684');
			var marker8 = dodajMarker(51.839068183003684,18.818346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_ADS1234<br/>51.839068183003684');
			var marker9 = dodajMarker(51.739068183003684,18.728346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_ADS12345<br/>51.739068183003684');
			var marker10 = dodajMarker(51.739068183003684,17.728346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_ADS443<br/>51.739068183003684');
			var marker11 = dodajMarker(51.839068183003684,17.928346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_ADS443<br/>51.839068183003684');
			var marker12 = dodajMarker(53.839068183003684,18.928346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_ADS443<br/>53.839068183003684');
			var marker13 = dodajMarker(52.839068183003684,14.928346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_ADS443<br/>52.839068183003684');
			var marker14 = dodajMarker(52.839068183003684,15.928346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_ADS443<br/>52.839068183003684');
			var marker15 = dodajMarker(52.839068183003684,16.928346786499023,'<strong>NAZWA FIRMY:</strong><br /> FIRMA_ADS443<br/>52.839068183003684'); 
 
 
 
 }   
		</script>   
			
		<div id="selektor" style="width: 100%; height: 50px;  background: green;">
		TUTAJ BĘDĄ POLA SELEKCJI 
		</div> 
		
		<div id="mapka" style="width: 100%; height: 500px;">
		<!-- tu będzie mapa -->   
		</div>   
		<p id="info">
			Wiele markerów, każdy z własnym opisem i inną ikoną.
		</p>
    </body>      
</html>   
1

Jeżeli API serwerowe nie ma ograniczeń godzinnych, a tylko dzienne - to ładuj jak leci.

I drugie pytanie jeśli chodzi o adres jaką ma prawidłową postać w zapytaniu dla google??

patrząc na podpowiedzi w Google Maps to: im bardziej w prawo tym bardziej ogólny element adresu. czyli np.
ulica, miasto, wojewodztwo, kraj

na trzecią część nie mam czasu :p

btw: skoro NIE zajmujesz się i nie planujesz (o tym nie wspominałeś) zajmować się informatyką - to nie uważasz za stratę czasu uczyć się tego przez 2 miesiące ? :p

0

Co do ograniczenia jest ich 2.500 na IP ;) ale spoko GSM ma zmienne ;)

a kto powiedział ze nie chcę się tym zajmować programowaniem... ;) ??
Pod drodze uczę się C# bo docelowo chcę ogarnąć to wszystko w asp.net ale że php jest dostępny wszędzie i dużo manuali więc zacząłem od niego...
Co do projektu który tworzę tak najszybciej się uczę porzez robienie czegoś... całe życie nie będę przedstawicielem... A z tym klastrem to może znajdę rozwiązanie za 2 miesiące kolejne jak nikt nikt nie pomoże... No chyba że wcześniej znajdziesz czas ;)
user image

1 użytkowników online, w tym zalogowanych: 0, gości: 1