Google मानचित्र में इंटरेक्टिव सर्कल जो बदलती त्रिज्या

Question

पर बदलती है, मैं Google नक्शे के लिए एक इंटरैक्टिव सर्कल चाहता हूं, जो स्लाइडर में त्रिज्या को बदलता या घटता है।
यह ठीक काम कर रहा है जब मैं त्रिज्या में वृद्धि कर रहा हूँ, लेकिन यह नक्शा

$(function() { 
     $("#slide").slider({ 
       orientation: "horizontal", 
       range: "min", 
       max: 10000, 
       min: 500, 
       value: 500, 
       slide: function(event, ui) { 
          drawCircle(ui.value); 
              } 
          }); 
      }); 

function drawCircle(rad){ 
     circle = new google.maps.Circle({ 
       strokeColor: "#FF0000", 
       strokeOpacity: 0.8, 
       strokeWeight: 2, 
       fillColor: "#FF0000", 
       fillOpacity: 0.35, 
       map: myMap, 
       radius: rad }); 

     circle.bindTo('center', marker, 'position'); 
         } 

Answer 1

में बदल त्रिज्या को कम करने पर नहीं है (घटते) वृत्त वृत्त एक बार के बजाय हर स्लाइडर चाल घटना पर बनाएँ। स्लाइडर बदलते समय बस सर्कल के त्रिज्या को अद्यतन करें।

Untested कोड:

var circle; //global variable, consider adding it to map instead of window 

$(function() { 
    circle = new google.maps.Circle({ 
    strokeColor: "#FF0000", 
    strokeOpacity: 0.8, 
    strokeWeight: 2, 
    fillColor: "#FF0000", 
    fillOpacity: 0.35, 
    map: myMap, 
    radius: 500 
    }); 
    circle.bindTo('center', marker, 'position'); 

    $("#slide").slider({ 
    orientation: "horizontal", 
    range: "min", 
    max: 10000, 
    min: 500, 
    value: 500, 
    slide: function(event, ui) { 
    updateRadius(circle, ui.value); 
    } 
    }); 
}); 

function updateRadius(circle, rad){ 
    circle.setRadius(rad); 
}