更改谷歌地圖標記的顏色取決於變種

Question

我使用谷歌地圖API3一些Laravel 4.2

我需要顏色取決於VAR地圖是從我的數據庫

來找上的標記舉例來說，如果未來的變種是Rent的標誌應該是紅色的，如果它Sell的標誌應該是綠色

這是我嘗試

<script type="text/javascript"> 
      var locations = [ 
        @foreach($bannerMapBin as $pin) 
       ['<div style="width:300px;"><div style="float:left;margin-right:10px;height:92px;overflow:hidden;width:120px;"><a href="{{ URL::to('property-details/'.$pin->id) }}">@foreach($pin->propImages->slice(0, 1) as $image){{ HTML::image('images/propertyImages/'.$image->image, $pin->title, array('width'=>100, 'height'=>100)) }}@endforeach</a></div>{{ HTML::link('property-details/'.$pin->id, $pin->title) }} <br/> {{ $pin->propLocation->city }}</div>', {{ $pin->propLocation->lat }}, {{ $pin->propLocation->lng }}, 'type: Rent'], 
       @endforeach 
      ]; 
      var map = new google.maps.Map(document.getElementById('map'), { 
       zoom: 10, 
       center: new google.maps.LatLng(25.412392055138543, 51.188288833984416), 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      }); 
      var infowindow = new google.maps.InfoWindow(); 
      var marker, i; 
      var icons = { 
       Rent: { 
        icon: 'http://maps.google.com/mapfiles/ms/icons/green-dot.png' 
       }, 
       Sell: { 
        icon: 'http://chart.googleapis.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2%7CFF0000' 
       } 
      }; 

      for (i = 0; i < locations.length; i++) { 
       marker = new google.maps.Marker({ 
        icon: icons[locations.type], 
        position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
        map: map 
       }); 

       google.maps.event.addListener(marker, 'click', (function (marker, i) { 
        return function() { 
         infowindow.setContent(locations[i][0]); 
         infowindow.open(map, marker); 
        } 
       })(marker, i)); 
      } 
     </script> 

一切工作正常，但不能給這些標記的每一個不同的顏色。

我也試試這個'type: Rent'在我locations末，並使其作爲VAR那裏，但預期

Answer 1

看代碼沒有工作的locations內的元素都不是對象 - 數組對象，但是一個多維數組。我可以從你訪問你的元素的角度來看，例如緯度和經度。假設陣列中的該最後一個元素的類型，可以使用最後的索引或簡單地編號3中獲得的類型 - 陣列長度被4.

var lastIndex = locations[i].length - 1; // total elements (zero-based) minus 1; 
var iconType = icons[ locations[i][lastIndex] ].icon; 

marker = new google.maps.Marker({ 
    icon: iconType, 
    position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
    map: map 
}); 

或簡化版本：

marker = new google.maps.Marker({ 
    icon: icons[locations[i][4]].icon, // returns Rents or Sell 
    position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
    map: map 
}); 

理論上，如果從內部數組中刪除最後一個字符串type: Rent，上面的代碼應該可以工作。