Leaflet Marker Koordinaten aus Datenbank auslesen

BigJim87 · 20.05.2014

Hi Leute

Ich habe ein Problem mit meinen Hausaufgaben ^^

ich würde gerne auf einer Karte Marker anzeigen.
Ich habe ein Datenbank erzeugt in der ich die Lon, Lat Koordinaten sowie den Namen meiner Freunde gespeichert habe.
Nun Würde ich gerne diese Koordinaten auslesen und dazu für jeden Freund einen Marker erzeugen.
Verbinden mit der Datenbank, auslesen des ersten Freundes, und erstellen des Markers am richtigen Punkt funktioniert schonmal.
Allerdings die Umsetzung in einer Schleife sodass alle Werte ausgelesen werden und für jeden Freund ein neuer Marker erstellt wird, will noch nicht funktionieren.

Laufen soll das ganze übrigens mit Leaflet.
Leider vom Prof so vorgegeben... :mad:

Hier mal der Basis Quellcode:

Code:

<!DOCTYPE html>
<html>
    
    <head>
        <link rel="stylesheet" type="text/css" href="leaflet/leaflet.css" />
        <!--[if lte IE 8]>
            <link rel="stylesheet" type="text/css" href=" leaflet/leaflet.ie.css" />
        <![endif]-->
        <script src="leaflet/leaflet-src.js"></script>
        <style>
            html, body, #map {
                height: 100%;
            }
            body {
                padding: 0;
                margin: 0;
            }
        </style>
        <title>Creating markers with popups and handling events</title>
    </head>
    
    <body>
		
<?php

  $verbindung = include ('pgdb.inc.php');
  $table    = "freunde";

  $sql = "SELECT lon, lat, name FROM $table";
  $res = pg_query($sql);

		$row = pg_fetch_array($res, NULL, PGSQL_ASSOC);
		$lon = $row["lon"];
		$lat = $row["lat"];
		$name = $row["name"];
	

  pg_close ($verbindung);
  
 ?>

        <div id="map"></div>
        
        <script type="text/javascript">
            var map = L.map('map', {
                center: [<? echo $lon;?>, <? echo $lat;?>],
                zoom: 16
            });
            L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
                attribution: '© OpenStreetMap contributors'
            }).addTo(map);
           
            L.marker([<? echo $lon;?>, <? echo $lat;?>], {
                clickable: true
            })
                .bindPopup('<? echo $name;?>')
                .addTo(map);
                
                
        </script>
    </body>

</html>

Suche

Leaflet Marker Koordinaten aus Datenbank auslesen

BigJim87

Enthusiast