Facebook Wohnorte in Google Maps anzeigen (PHP/JavaScript)

**altf4** · 19.01.2012, 20:43

Hallo Forum,

ich möchte gerne die Wohnorte meiner Freundesliste (Facebook) auslesen und in Google Maps anzeigen, eigentlich soll sich jeder auf meiner Seite mit seinem Facebook Konto anmelden können und seine Freunde auf einer Weltkarte (Google Maps) sehen können, evtl. sogar mit Bild.

Die Freundesliste mit Wohnorte bekomme ich so raus:

PHP

Code:

								$friends = $facebook->api('/me/friends?fields=name,hometown', 'GET');
								$friendsData = $friends['data'];
								for ($i = 0; $i < sizeof($friendsData); $i++)
								{
  								 $friend = $friendsData[$i];
								 echo "City: " . $friend['hometown']['name'] . "<br>" ;
								 echo "Name: " . $friend['name'] . "<br>" ;
								}

Jetzt möchte ich City/Name auf einer Google Maps Karte darstellen, für die Karte hab ich mir bisher folgendes zusammen gebastellt. Bisher kann man auf der Karte Koordinatoren angeben, mehr nicht. Die Funktion soll hier zusätzlich wenn möglich dazu kommen.

Code:





<!DOCTYPE 


	html 
	


 PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
 Copyright 2008 Google Inc. 
 Licensed under the Apache License, Version 2.0: 
 http://www.apache.org/licenses/LICENSE-2.0 
 -->
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
  
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Google Maps AJAX + MySQL/PHP Example</title>
    <script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAjU0EJWnWPMv7oQ-jjS7dYxSPW5CJgpdgO_s4yyMovOaVh_KvvhSfpvagV18eOyDWu7VytS6Bi1CWxw"
            type="text/javascript"></script>
    <script type="text/javascript">
    //<![CDATA[
    var map;
    var geocoder;


   function load() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map"), {mapTypes:[G_NORMAL_MAP, G_SATELLITE_MAP, G_HYBRID_MAP]});
        var x = document.getElementById("koords_x").value;
        var y = document.getElementById("koords_y").value;
        var center = new GLatLng(x,y);
        map.addControl(new GLargeMapControl());
    		map.addControl(new GMapTypeControl());
    		map.addControl(new GScaleControl());
    		map.addControl(new GOverviewMapControl());
        map.setCenter(center, 11);       
        map.addOverlay(createMarker( new GLatLng(47.345678, 11.345678), "www.


	php 
	


.de ist toll!!!<br>GoogleMaps auch :D"));
      }
    }
  </script>
  </head>


  <body onload="load()" onunload="GUnload()" bgcolor="silver">
   <form name="maps" action="map.


	php 
	


">
    <div id="map" style="width: 800px; height: 600px"></div>
    <br>
    <input type="text" id="koords_x" size="18" maxlength="15" value="47.345678">
    <br>
    <input type="text" id="koords_y" size="18" maxlength="15" value="11.345678">
    <br>
    <input type="button" name="laden" value="Karte laden" onclick="load() "/>
   </form>
  </body>
  
  echo "
   <script type=\"text/javascript\"><!--
     var daten = \"".$daten."\";
   </script>
 ";

Nach Ratschlag hier im Forum versuche ich gerade die Daten in ein mehrdimensionalen Array

reinzupacken und dann durch ne
for/each Schleife um sie anschließend auf der Karte anzuzeigen....
das dürfte so aber sich nicht stimmen, oder?

Code:

$Punkte = 


	array 
	


();


$Punkte[ ] = 


	array 
	


('Name' => "Facebook Name". 'name',$friend);
$Punkte[ ] = 


	array 
	


('City' => "Facebook City",'hometown''name', $friend);




foreach($Punkte as $Markierung)     /* aus dem 3-Dimensionalen $Punkte wird ein 2-Dimensionaler $Markierung */
{
     echo "User<b>$Markierung[Titel]</b> ";
     if($Markierung['name'] != "") {     
          echo "( $Markierung[name] ) ";     
     }
     echo " $Markierung[name].<br />\n";

***Chronos*** · 19.01.2012, 21:20

den array

bildest du am besten so

PHP-Code:


$punkte[] = array(
'name' => $name, 
'wohnort' => $wohnort);

wobei die frage ist, wie sieht den dein

$friends['data'] genau aus? vielleicht ist es das schon sogar was du brauchst :-)

**altf4** · 19.01.2012, 21:24

Wie meinst denn das? meine $friends['Data'] sieht so aus...

<?php
if($user_id)
{
try
{

$friends = $facebook->api('/me/friends?fields=name,hometown', 'GET');
$friendsData = $friends['data'];
for ($i = 0; $i < sizeof($friendsData); $i++)
{
$friend = $friendsData[$i];
echo "City: " . $friend['hometown']['name'] . "<br>" ;
echo "Name: " . $friend['name'] . "<br>" ;
}

Ausgabe ist:

City: Hamburg
Name: Frank Müller

***Chronos*** · 19.01.2012, 21:27

ne ich meine der gesamte array

PHP-Code:


echo'<pre>'.print_r($friends['data']).'</pre>';

wie sieht der arrayaufbau aus, kannst mal posten was da rauskommt? zumindest für index 0

**altf4** · 19.01.2012, 21:31

Array ( [0] => Array

( [name] => Frank Müller [hometown] => Array

( [id] => 10796554560008 [name] => Hamburg ) [id] => 123456)

***Chronos*** · 19.01.2012, 21:42

eigentlich könntest du diesen array

verwenden und brauchst nicht nen neuen basteln

PHP-Code:


foreach($friends['data'] as $data){
 $name = $data['name'];
 $hometown = $data['hometown'];

HIER DAS ZEICHNEN DES PUNKTES AUF DER MAP
}

**altf4** · 19.01.2012, 21:46

Hey Klasse und vielen Dank! Kannst Du mir noch bitte sagen wie ich das ganze in meine Maps Karte einfüge kann?
Oder wo genau muss die foreach Schleife hin?

***Chronos*** · 19.01.2012, 22:12

wenn ich deinen code jetzt richtig lesen dann ist folgendes dafür "verantwortlich" das punkte gezeichnet werden

map.addOverlay(createMarker( new GLatLng(47.345678, 11.34567

das problem bei dir ist, hometown ist eine stadt und keine koordinaten. d.h du musst das ganze per Geokodierung machen (hört sich kompliziert an, aber im endeffekt ist es nix anderes als die position per adresse)

ein einfaches beispiel (bevor ich hier lang erkläre)
Google Maps API Example: Simple Geocoding

Hier steht die Adresse halt im Input Feld
ich würde folgendes mal versuchen.

nach

PHP-Code:


geocoder = new GClientGeocoder();

starten wir mit der Schleife

PHP-Code:


foreach($friends['data'] as $data){
 $name = $data['name'];
 $hometown = $data['hometown'];
?>
<!-- hier rufen wir die javascript funktion auf und übergeben die adresse -->
showAddress(<?=$hometown; ?>);
<?php
}

er ruft jetzt jedesmal die showAddress Funktion auf (siehe Link

oben) und übergibt die Adresse, Punkt wird gezeichnet und landet in der Map.
Ich weiß jetzt nur nicht ob er alle punkte zeigt...und nicht den overLayer immer überschreibt (sorry schon spät)

verusch das mal heute und sag bescheid, sonst hab ich morgen ne 2. alternative, muss nur schauen wo der Code rumliegt von mir.