javascript - How to create circle around maker when using Google maps MarkerCluster for api v3 -
i using google maps markercluster api v3 create cluster marker. works well. want use circle around marker , can drag radius of circle.
var markerclusterer = null; var map = null; var imageurl = 'http://chart.apis.google.com/chart?cht=mm&chs=24x32&' + 'chco=ffffff,008cff,000000&ext=.png'; function initialize() { map = new google.maps.map(document.getelementbyid('map_canvas'), { zoom: 6, center: new google.maps.latlng(46.578498, 2.457275), maptypeid: google.maps.maptypeid.roadmap }); var markers = []; var markerimage = new google.maps.markerimage(imageurl, new google.maps.size(24, 32)); (var = 0; < macdolist.length; i++) { var latlng = new google.maps.latlng(macdolist[i].lat, macdolist[i].lng); var marker = new google.maps.marker({ position: latlng, icon: markerimage }); markers.push(marker); } markerclusterer = new markerclusterer(map, markers, { maxzoom: 16, gridsize: 100, styles: clusterstyles }); } function clearclusters(e) { e.preventdefault(); e.stoppropagation(); markerclusterer.clearmarkers(); } google.maps.event.adddomlistener(window, 'load', initialize);
anyone can me resolve case?
i create circle successfully. i'd share solution everyone. hope it's useful one.
function initialize() { map = new google.maps.map(document.getelementbyid('map_canvas'), { zoom: 6, center: new google.maps.latlng(46.578498, 2.457275), maptypeid: google.maps.maptypeid.roadmap }); var markers = []; var markerimage = new google.maps.markerimage(imageurl, new google.maps.size(24, 32)); (var = 0; < macdolist.length; i++) { var latlng = new google.maps.latlng(macdolist[i].lat, macdolist[i].lng); var marker = new google.maps.marker({ position: latlng, icon: markerimage }); google.maps.event.addlistener(marker, 'click', function(a) { var drawcircle = new google.maps.circle({ center: new google.maps.latlng(this.position.lat(), this.position.lng()), editable:true, radius: 50, // metres fillcolor: 'yellow' }); drawcircle.setmap(map); //circle.bindto('center', marker, 'position'); }); markers.push(marker); }
Comments
Post a Comment