Social Network

info@matteobarison.com
+39 3938295104
info@matteobarison.com
+39 3938295104

Eventi di FaceBook su google maps!

Cattura

Eventi di Facebook su Google Maps

Ma è possibile avere gli eventi di Facebook su una mappa di google?

La risposta è Si!

In sintesi:

Gli eventi di Facebook vengono presi tramite un’applicazione che sfrutta le graph api.

Una volta presi gli eventi dalla pagina Facebook impostata, questi vengono inseriti automaticamente con un marker su una mappa generata con google maps api v3

 

Questo script è disponibile anche su emoticode al seguente link http://www.emoticode.net/php/google-maps-with-facebook-events.html


<?php
/*
* author : f107
* site : http://matteobarison.com
* desc : Google maps with Facebook Events
* date : 23/07/2013
*/
//Settings
define(‘FB_APP_ID’, ”);
define(‘FB_APP_SECRET’, ”);
define(‘FB_PAGE_ID’, ”);
define(‘GOOGLE_MAPS_API’, ”);
//get token
$aToken = file_get_contents(
sprintf(
‘https://graph.facebook.com/oauth/access_token?grant_type=client_credentials&client_id=%s&client_secret=%s’,
FB_APP_ID,
FB_APP_SECRET
)
);
parse_str($aToken, $aData);
//get all events
$aCampi = array(
‘venue’,
‘description’,
‘location’,
‘name’
);
$oEvents = json_decode(
file_get_contents(
sprintf(
‘https://graph.facebook.com/%s/events?fields=%s&access_token=%s’,
FB_PAGE_ID,
implode( ‘,’, $aCampi ),
$aData[‘access_token’]
)
)
);
$sMarker = ”;
$i=0;
foreach($oEvents->data as $oEvent)
if(property_exists($oEvent->venue, ‘latitude’))
$sMarker .= sprintf(“aMarker[%d] = new Array(%f, %f, ‘%s’)n”, $i++, $oEvent->venue->latitude, $oEvent->venue->longitude, $oEvent->name );
?>
<html>
<head>
<script src=”https://maps.googleapis.com/maps/api/js?key=<?php echo GOOGLE_MAPS_API;?>&sensor=false” /></script>
<script>
var aMarker = new Array()
<?php echo $sMarker;?>
var map, mapOptions = null
aM = new Array()
function initialize() {
var mapOptions = {
center: new google.maps.LatLng(44.4908333333, 9.14055555556),
zoom: 6,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById(‘map-canvas’), mapOptions);
var info = new google.maps.InfoWindow();
for(var i = 0; i < aMarker.length; i++)
{
var marker = new google.maps.Marker({
position: new google.maps.LatLng(aMarker[i][0], aMarker[i][1]),
map: map,
title: aMarker[i][2],
visible: true
});
google.maps.event.addListener(marker, ‘click’, function(marker, i) {
return function()
{
info.setContent(aMarker[i][2])
info.open(map,marker);
map.setCenter(mapOptions[‘center’])
}
}(marker, i));
aM.push(marker)
}
}
google.maps.event.addDomListener(window, ‘load’, initialize);
</script>
</head>
<body>
<div id=’map-canvas’ style=’height:500px; margin-bottom:20px;’></div>
</body>
</html>