javascript - Google Maps V3: Pass drag event on marker to map -
i'm drawing multiple radius circles on map following code:
function drawradius(size){ var circle = new google.maps.marker({ position: map.getcenter(), zindex: 1, icon: { path: google.maps.symbolpath.circle, scale: size, strokeopacity: 0.65, strokeweight: 4, fillcolor: '#fefcf3', fillopacity: 0.08, strokecolor: '#efe8b2' }, map: map }); }
this method called multiple times different size parameters, results in the following image:
unfortunately, can't move map anymore, because - far can tell - events fired on circles , not on map.
how can fix this? want able drag/move map.
thank you!
if don't need click on circles (markers), set clickable: false
on them, prevents markers receiving mouse events.
from the documentation:
clickable boolean if true, marker receives mouse , touch events. default value true.
function drawradius(size){ var circle = new google.maps.marker({ position: map.getcenter(), zindex: 1, clickable: false, icon: { path: google.maps.symbolpath.circle, scale: size, strokeopacity: 0.65, strokeweight: 4, fillcolor: '#fefcf3', fillopacity: 0.08, strokecolor: '#efe8b2' }, map: map }); }
code snippet:
var geocoder; var map; function initialize() { map = new google.maps.map( document.getelementbyid("map_canvas"), { center: new google.maps.latlng(37.4419, -122.1419), zoom: 10, maptypeid: google.maps.maptypeid.roadmap }); (var size = 100; size < 600; size += 100) { drawradius(size); } } google.maps.event.adddomlistener(window, "load", initialize); function drawradius(size) { var circle = new google.maps.marker({ position: map.getcenter(), zindex: 1, clickable: false, icon: { path: google.maps.symbolpath.circle, scale: size, strokeopacity: 0.65, strokeweight: 4, fillcolor: '#fefcf3', fillopacity: 0.08, strokecolor: '#000000' }, map: map }); }
html, body, #map_canvas { height: 100%; width: 100%; margin: 0px; padding: 0px }
<script src="https://maps.googleapis.com/maps/api/js"></script> <div id="map_canvas" style="border: 2px solid #3872ac;"></div>
Comments
Post a Comment