2015-09-06 140 views
-2

有什麼方法可以將我們自制的圖標用於集羣,而不是圖庫中的圖標? 這是我的代碼,沒有樣式選項的頁面工作正常,但與樣式選項地圖不隨標記Google Maps Api v3,自制集羣圖標

var longitude = position.coords.longitude; 
    var latitude = position.coords.latitude; 
    var latLong = new google.maps.LatLng(latitude, longitude); 
    var locations = [ 
    ['Bondi Beach','<a href="story-detail.html">nepal</a>', 27.893, 85.667, 4], 
    ['Coogee Beach','<a href="story-detail.html">nepal</a>', 27.883, 85.657, 5], 
    ['Cronulla Beach', '<a href="story-detail.html">nepal</a>', 27.873, 85.647, 3], 
    ['Manly Beach', '<a href="story-detail.html">nepal</a>',27.863, 85.637, 2], 
    ['Maroubra Beach', '<a href="story-detail.html">nepal</a>',27.69, 85.427, 1] 
]; 


var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 10, 
    center: latLong, 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    disableDefaultUI:true 
}); 
var geomarker = new google.maps.Marker({ 
    position: latLong, 
    map: map, 
    title: 'your location', 
    icon: 'http://labs.google.com/ridefinder/images/mm_20_green.png' 
    }); 

var infowindow = new google.maps.InfoWindow(); 
google.maps.event.addListener(geomarker, 'click', (function(geomarker) { 
    return function() { 
     infowindow.setContent('You are here'); 
     infowindow.open(map, geomarker); 
    } 
    })(geomarker)); 

var markers=[], i; 

for (i = 0; i < locations.length; i++) { 

    var marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(locations[i][2], locations[i][3]) 
    //map: map 
    }); 
    google.maps.event.addListener(marker, 'click', (function(marker, i) { 
    return function() { 
     infowindow.setContent(locations[i][1]); 
     infowindow.open(map, marker); 
    } 
    })(marker, i)); 

    markers.push(marker); 
} 
var markerCluster = new MarkerClusterer(map, markers, { 
styles: [{ 
    url: '../img/logo.png' 
}, { 
    url: '../imglogo.png' 
}, { 
    url: '../img/logo.png' 
}]); 
+1

你有什麼試過的?請學習[如何製作最小化,完整且可驗證的示例。](http://stackoverflow.com/help/mcve) –

回答

0

是其餘加載,根據文檔: http://gmaps-utility-library-dev.googlecode.com/svn/tags/markerclusterer/1.0/docs/reference.html

MarkerClusterer構造函數帶有一個MarkerClustererOptions對象,該對象可以包含一個包含圖像URL的styles數組。該文件是一個位表明實際的例子缺乏,但你可以看到它發生在這裏,如果你更改羣集風格:

https://googlemaps.github.io/js-marker-clusterer/examples/advanced_example.html

我認爲你需要做的僅僅是這樣的:

markerClusterer = new MarkerClusterer(map, markers, { 
    styles: [{ 
     url: '../images/people35.png' 
    }, { 
     url: '../images/people45.png' 
    }, { 
     url: '../images/people55.png' 
    }] 
}); 
+0

當我使用樣式選項時,我的地圖不會與其他標記一起加載,但沒有樣式選項相同的代碼完美地工作。 –