2つの異なるテーブルの値を使用して1つのGoogleマップにマーカーを表示

Question

ここは私のコードです。データベーステーブルから緯度と経度を読み取り、マーカーをマーカーに追加します。私がしたいのは、別のテーブルを追加して、同じマップの緯度と経度の値に従って異なる色のマーカーを追加することです。私は2つの異なるテーブルから緯度と経度を取る方法と、異なる色のマーカーで地図に表示する方法を知らない。

function initialize() { 
    <?php echo "initializing: ";?> 
    var position = new google.maps.LatLng(39.40233290,77.89265660); 
    var image = { 
     url: 'images/image.png', 
     // This marker is 20 pixels wide by 32 pixels high. 
     size: new google.maps.Size(30, 32) 
    }; 

    var myOptions = { 
     zoom: 10, 
     center: position, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

    <?php  
    $sql="select latitude,longitude FROM coffeeshop "; 
    $records = mysql_query($sql, $conn); 
    if (!$records) { 
     echo "Could not successfully run query ($sql) from DB: " . mysql_error(); 
     exit; 
    } 

    while($row = mysql_fetch_assoc($records)) { 
     ?> 
     var lat= <?php echo $row['latitude'] ?>; 
     var long=<?php echo $row['longitude'] ?>; 
     addMarker(lat,long); 
     <?php echo $row['longitude']; 
    } 
    ?> 

    var geocoder = new google.maps.Geocoder; 
    var infowindow = new google.maps.InfoWindow; 

    var marker = new google.maps.Marker({ 
     position: position, 
     map: map, 
     title:"This is the place." 
    }); 

    var marker2 = new google.maps.Marker({ 
     position: position, 
     map: map, 
     icon: image, 
     title:"This is the place." 
    }); 

    var contentString = 'Hello <strong>World</strong>!'; 
    var infowindow = new google.maps.InfoWindow({ 
     content: contentString 
    }); 

    google.maps.event.addListener(marker, 'click', function() { 
     infowindow.open(map,marker); 
     geocodeLatLng(geocoder, map, infowindow); 
    }); 

    google.maps.event.addListener(marker2, 'click', function() { 
     infowindow.open(map,marker2); 
     geocodeLatLng(geocoder, map, infowindow); 
    }); 

    function addMarker(lat,long) { 
     var latlongMarker = new google.maps.LatLng(lat,long); 

     var marker = new google.maps.Marker({ 
      position: latlongMarker, 
      map: map,    
     }); 

     var marker2 = new google.maps.Marker({ 
      position: latlongMarker, 
      map: map, 
      icon:image,    
     }); 

     google.maps.event.addListener(marker, 'click', function() { 
      infowindow.open(map,marker); 
      geocodeLatLng(geocoder, map, infowindow,marker);  
     }); 
    }  
} 

Answer 1

は、私はあなたが値を何のMySQL関数を取得していないために、AJAXを使用することをお勧めします。

ajaxでは、特定のPHPメソッドからデータを取得できます。このメソッドは、dbから必要なすべてのデータを集め（2つのテーブルから）、1つの配列として準備します（ajax経由でjsonにエンコードする必要があります）。

javascriptでPHPを混乱させないように、コードもより洗練されたものになります。