Bu makalemizde Google Maps Api servisini kullanarak web sayfalarımızda dinamik içerikli haritalar oluşturacağız.Google Maps servisinden yararlanabilmemiz için ilk olarak Google web sayfasını ziyaret edip Api-key oluşturmamız gerekiyor.Api-key oluşturmak için http://www.google.com.tr/apis/maps/signup.html adresini kullabilirsiniz.

Api-key oluşturduktan sonra veri tabanımızı oluşturalım.

ID: Her harita için benzersiz bir değer belirtecek
Baslik: Harita Başlığı
Enlem: Enlem üzerindeki koordinat
Boylam: Boylam üzerindeki koordinat
Zoom: Harita üzerindeki yakınlaşma miktarı

Veri Tabanımızı oluşturduktan sonra gerekli sayfalarımızı oluşturmaya geçebiliriz.
Öncelikle “ayar.php” adında boş bir php dosyası oluşturalım ve veri tabanımıza bağlanmak için gerekli parametlerimizi yazalım.

<?php

$vthost = "localhost";    //üzerinde çalışacağımız mysql sunucusu %99 değiştirmenize gerek yok standarttır.

$vtkullanici = "root";    //mysql kullanıcı adı

$vtsifre = "123123";   //mysql kullanıcı şifresi

$vtadi = "maps";      //veri tabanının adı

$baglan = @mysql_connect($vthost,$vtkullanici,$vtsifre);  //veri tabanına bağlanmak için gereken sunucu adı,kullanıcı adı ve kullanıcı şifresini bağlantı değişkenimize atadık

    if(!$baglan) die ("Mysql Bağlantısı Sağlanamadı");  // eğer mysql sunucusuna bağlantı sağlanmazsa baglan değişkenini sonlandırıp yazmış olduğumuz hata mesajını ekrana yazdırıcak.

mysql_Select_db($vtadi,$baglan) or die ("Veri Tabanı Bağlantısı Sağlanamadı");     //veri tabanına bağlanamazsa bağlanma işlemini sonlandıracak ve yazmış olduğumuz hata mesajını ekrana yazdıracak.

?>

“index.php” adında boş bir php dosyası oluşturalım ve harita bilgilerimizi veri tabanından çekicek kodlarımızı yazalım.

<?php

//veri tabanı bağlantı parametlerimizin bulunduğu sayfayı çağırıyoruz

include("ayar.php");

?>
<table>
<tr>
<td width="150" align="center"><b>Harita ID</b></td>
<td width="300" align="center"><b>Harita Başlık</b></td>
<td width="200" align="center"><b>Önizle</b></td>
</tr>

<?php

//haritalar tablosundaki tüm alanları seç ve id numarasına göre tersten sıralar

$sorgu = mysql_query("SELECT * FROM haritalar order by ID desc");

//haritalar tablosundaki seçtiğimiz alanları while döngüsüne alarak seçili alanların yazdırılması bitine kadar döngü işlemini devam ettirir

    while($yaz = mysql_fetch_array($sorgu)){

//haritalar tablosundaki "ID" alanındaki değeri "id" değişkenine atadık

        $id        =    $yaz["ID"];

//haritalar tablosundaki "Baslik" alanındaki değeri "baslik" değişkenine atadık

        $baslik    =    $yaz["Baslik"];

      ?>

<tr>

<!--haritalar tablosundaki "ID" alanını yazdırır-->

<td width="150" align="center"><?php echo $id;?></td>

<!--haritalar tablosundaki "Baslik" alanını yazdırır-->

<td width="300" align="center"><?php echo $baslik;?></td>

<!--haritalar tablosundaki "ID" alanındaki değeri "id" adlı değişkene aktarmıştık.Şimdi "id" değişkenini haritamızın detaylı şekilde gösterileceği "goster.php" sayfamıza yönlendirileceği linke ekledik-->

<td width="200" align="center"><a href="goster.php?id=<?php echo $id;?>">Önizle</a></td>
</tr>
<?php } ?>
</table>

“goster.php” adlı boş bir php dosyası oluşturuyoruz ve harita bilgilerini detaylı bir şekilde görüntüleyecek olan kodlarımızı yazıyoruz.

<?php

//veri tabanı bağlantı parametlerimizin bulunduğu sayfayı çağırıyoruz

include("ayar.php");

//"index.php" dosyamızdan gelen haritaya ait id değerini alarak "id" değişkenine atıyoruz

$id    =    intval($_GET['id']);

//haritalar tablosundaki belirtilen id ye ait  tüm alanları seçer

$sorgu = mysql_query("SELECT * FROM haritalar where ID='$id'");

//haritalar tablosundaki seçtiğimiz alanları while döngüsüne alarak seçili alanların yazdırılması bitine kadar döngü işlemini devam ettirir

    while($yaz = mysql_fetch_array($sorgu)){

//haritalar tablosundaki "Enlem" alanındaki değeri "enlem" değişkenine atadık

      $enlem    =    $yaz['Enlem'];

//haritalar tablosundaki "Boylam" alanındaki değeri "boylam" değişkenine atadık

      $boylam    =    $yaz['Boylam'];

//haritalar tablosundaki "Zoom" alanındaki değeri "zoom" değişkenine atadık

      $zoom    =    $yaz['Zoom'];

      }
      ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<!--Başlangıçta oluşturduğumuz Api-keyi "key" stringine atıyoruz ("ABQIAAAA1AyyoqTwvL4FYVv9RX-UZRS2UztaDSNruPSGSODVRCNJKRnyiRSR1lgI85sroQmdcrgNXXXXXXXXXX" yerine siz kendi anahtarınızı yazın) -->

<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAA1AyyoqTwvL4FYVv9RX-UZRS2UztaDSNruPSGSODVRCNJKRnyiRSR1lgI85sroQmdcrgNXXXXXXXXXX"
type="text/javascript">
</script>
<script type="text/javascript">
//<![CDATA[
function haritaGoster() {
if (GBrowserIsCompatible()) {

<!--Haritanın gözükeceği alanı ("haritaDiv") belirtiyoruz.-->

var denemeHaritasi = new GMap2(document.getElementById("haritaDiv"));

denemeHaritasi.addControl(new GSmallMapControl());

<!--Haritanın koordinatlarını belirtiyoruz-->

var koordinat = new GLatLng(<?php echo $enlem;?>,<?php echo $boylam;?>);

<!--Haritada gözükücek olan resmin koordinatlarını belirtiyoruz -->

var resimKoordinat = new GLatLng(<?php echo $enlem;?>,<?php echo $boylam;?>);

var resim = new GIcon();

resim.image = "img/icon.png";

resim.iconAnchor = new GPoint(6, 5);

resim.infoWindowAnchor = new GPoint(25, 2);

<!--Haritada gözükücek olan resmi koordinatlarını "isaret" değişkenine atıyoruz  -->

var isaret = new GMarker(resimKoordinat,resim);

GEvent.addListener(isaret, "click", function() {

}
);

<!--Haritaya yakınlaştırma oranını belirtiyoruz-->

denemeHaritasi.setCenter(koordinat, <"php echo $zoom;">);

<!--Haritaya "isaret" değişkenimizi ekliyoruz -->

denemeHaritasi.addOverlay(isaret);
}
}
//]]>
</script>
</head>

<!--Sayfa yüklendiğinde "haritaGoster" fonksiyonu çalışıcak ve harita görüntülenicek -->

<body onload="haritaGoster()" onunload="GUnload()">

<!--Haritanın görüntüleneceği alan -->

<div id="haritaDiv" style="width: 300px; height: 400px"></div>

</body>

</html>

Kaynak Dosyayı İndir

Koordinat (Enlem,Boylam) bulmak için bu siteyi kullanabilirsiniz.

Burak KIRBAĞ

The post Php ile Dinamik Google Haritaları Oluşturmak first appeared on Barış ÖZCAN Web Tasarım | antalya web tasarım | antalya web tasarımı | Sosyal Medya Danışmanlığı.