基於PHP值的Google Maps API V3中的不同標記

Question

我已經到了從通過PHP創建的標記集傳遞一個值的點，但我無法弄清楚如何創建或實現IF條件來顯示標記與「類型」值相關的圖像。

代碼：

<script type="text/javascript"> 


var iconStar = new google.maps.MarkerImage("googleMarkers/star.png", 
        new google.maps.Size(32, 28), 
        new google.maps.Point(0, 0), 
       new google.maps.Point(16, 32)); 


var iconBlue = new google.maps.MarkerImage("images/mm_20_blue.png", 
        new google.maps.Size(12, 20), 
        new google.maps.Point(0,0), 
       new google.maps.Point(6, 20)); 



var iconRed = new google.maps.MarkerImage("images/mm_20_red.png", 
        new google.maps.Size(12, 20), 
        new google.maps.Point(6, 20), 
       new google.maps.Point(5, 1)); 

var iconYellow = new google.maps.MarkerImage("images/mm_20_yellow.png", 
        new google.maps.Size(12, 20), 
        new google.maps.Point(6, 20), 
       new google.maps.Point(5, 1)); 

iconType = [] = iconStar; 
iconType["0"] = iconStar; 
iconType["1"] = iconBlue; 
iconType["2"] = iconRed; 
iconType["3"] = iconYellow; 



     var center = null; 
     var map = null; 
     var currentPopup; 
     var bounds = new google.maps.LatLngBounds(); 

     function addMarker(lat, lng, info, type) { 
      var pt = new google.maps.LatLng(lat, lng); 
      bounds.extend(pt); 
      var marker = new google.maps.Marker({ 
       position: pt, 
       icon: iconType, 
       map: map 
      }); 


      var popup = new google.maps.InfoWindow({ 
       content: info, 
       maxWidth: 300 
      }); 


      google.maps.event.addListener(marker, "click", function() { 
       if (currentPopup != null) { 
        currentPopup.close(); 
        currentPopup = null; 
       } 
       popup.open(map, marker); 
       currentPopup = popup; 
      }); 
      google.maps.event.addListener(popup, "closeclick", function() { 
       // panTo puts you back to the original center - not good for zoomed in nav 
       // map.panTo(center); 
       currentPopup = null; 
      }); 
     } 


     function initMap() { 
      map = new google.maps.Map(document.getElementById("map"), { 
       center: new google.maps.LatLng(0, 0), 
       zoom: 13, 
       mapTypeId: google.maps.MapTypeId.ROADMAP, 
       mapTypeControl: false, 
       mapTypeControlOptions: { 
       style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR 
       }, 
       navigationControl: true, 
       navigationControlOptions: { 
       style: google.maps.NavigationControlStyle.DEFAULT 
       } 

      }); 







<?php 
do { 
$name=$row_rsCity['DEALER']; 
$lat=$row_rsCity['lat']; 
    $lon=$row_rsCity['lng']; 
    $desc=$row_rsCity['ADDRESS']; 
    $city=$row_rsCity['CITY']; 
    $state=$row_rsCity['STATE']; 
    $phone=$row_rsCity['PHONENUMBER']; 
    $type=$row_rsCity['DEALER_TYPE']; 
    echo ("addMarker($lat, $lon,'<b>$name</b><br/>$desc<br/>$city , $state<br />Phone: $phone',$type);\n"); 
    } while ($row_rsCity = mysql_fetch_assoc($rsCity)); 
    ?> 
    center = bounds.getCenter(); 
    map.fitBounds(bounds); 

    } 

我很接近，但我不能找到類似的例子網上，這樣尋找解決這一問題的幫助不大。

謝謝！

Answer 1

當您調用addMarker函數時，需要通過函數列表中的類型傳遞圖標類型（數字）。

然後當你添加標記。 ：

function addMarker(lat, lng, info, type) { 
      var pt = new google.maps.LatLng(lat, lng); 
      bounds.extend(pt); 
      var marker = new google.maps.Marker({ 
       position: pt, 
       icon: iconType[type], 
       map: map 
      }); 

添加在數字類型來引用你的圖標排列正確的圖標.......

我還沒有過這樣做過，但我不明白爲什麼它不會工作。

如果這不起作用，你可能想看看這個例子。 ：

Change individual markers in google maps directions api V3

Google Maps API v3: How do I dynamically change the marker icon?