title: Using PHP and MySQL to show multiple markers on Google Maps
body: <p>I tried to use PHP and MySQL to show multiple markers on a Google Maps, but it doesn't work as the map doesn't show. Please help me with this and don't forget to change the mapkey. 
  Thank you.</p>
  
  <p>Here is my code:</p>
  
  <pre><code>      &lt;%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%&gt;
        &lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
  
        &lt;?php
  
        $connexion=mysql_connect("localhost", "root", "") or die(mysql_error());
        mysql_select_db("survey",$connexion) or die(mysql_error());
  
        //la requête pour obtenir la liste des points
        $result = mysql_query("SELECT latitude,longitude FROM appreciation order by id");
  
        //récupération de tous les points pour les mettre dans une table façon JavaScript
  
        $listeDesPoints='';
        while($row = mysql_fetch_array($result)){
        if($listeDesPoints!='') $listeDesPoints.=','; 
        $listeDesPoints.='['.$row['lattitude'].','.$row['longitude'].']';
        }
        //et voilà $listeDesPoints est prêt à être affiché dans le script
  
        //on ferme la connexion à la base de données
        mysql_close($connexion);
        ?&gt;
        &lt;html&gt;
        &lt;head&gt;
        &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
        &lt;title&gt;Insert title here&lt;/title&gt;
        &lt;script type="text/javascript"
        src="http://maps.googleapis.com/maps/api/js? key=AIzaSyB3is760vHXhki9vS_LpiWAig8a33GP3CY&amp;sensor=false"&gt;
        &lt;/script&gt;
  
        &lt;script type="text/javascript"&gt;
        function initialize(){
        var centreCarte = new google.maps.LatLng(34.02,-6.83);
  
        var optionsCarte = {
        zoom: 12,
        center: centreCarte,
        keyboardShortcuts: true,
        scrollwheel: true,
        panControl: false,
        mapTypeControl: true,
        overviewMapControl: true,
        rotateControl: true,
        scaleControl: true,
        streetViewControl: true,  
        zoomControl: true,        
        mapTypeId: google.maps.MapTypeId.HYBRID                                        
        }
  
        var map = new google.maps.Map(document.getElementById("map"), optionsCarte);
  
  
  
  
  
        var liste_des_points=[
        &lt;?php echo $listeDesPoints; ?&gt;
        ];
  
  
        var i=0,li=liste_des_points.length;
        while(i&lt;li){
        new google.maps.Marker({
        position: new google.maps.LatLng(liste_des_points[i][0], liste_des_points[i][1]),
        map: Carte,
        title: "Marqueur-"+i,
             });
        i++;
   }
  
  
   }
        &lt;/script&gt;
        &lt;/head&gt;
        &lt;body onload="initialize()"&gt;
  
        &lt;div id="map" style="width:80%; height:80%" &gt;
        &lt;/div&gt;
        &lt;/body&gt;
        &lt;/html&gt;
  </code></pre>