删除谷歌地图圈内覆盖功能

本文介绍了删除谷歌地图圈内覆盖功能的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我重新编写了这段代码，因此它更短，但基本上我试图用左键单击添加一个圆，然后右键单击它。 radius.setMap（null）只在不在函数内时才起作用。

I've redone this code so it's shorter, but basically I'm trying to add a circle with left click and remove it with right click. The radius.setMap(null) works only if it's not inside a function.

    <!DOCTYPE html>
    <html>
      <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
      html { height: 100%% }
      body { height: 100%%; margin: 0; padding: 0 }
      #map_canvas { height: 100%% }
    </style>
    <script type="text/javascript"
      src="http://maps.googleapis.com/maps/api/js?key=mykey&sensor=false">
    </script>
    <script type="text/javascript">
      var centerlatlng = new google.maps.LatLng(-27.467726,153.026633);
      function initialize() {
        var mapOptions = {
          center: centerlatlng,
          zoom: 16,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"),
            mapOptions);

        var marker = new google.maps.Marker({
                                            position: centerlatlng,
                                            map: map,
                                            title:"Hello World!"});

        google.maps.event.addDomListener(map, 'click', updateCircle);
        google.maps.event.addDomListener(map, 'rightclick', removeRadius);

    function removeRadius(){
        radius.setMap(null);}

    function updateCircle(){
        var radius = new google.maps.Circle({map: map,
                                            radius: 400,
                                            center: centerlatlng,
                                            fillOpacity: 0});}
    }

    </script>
  </head>
  <body onload="initialize()">
    <div id="map_canvas" style="width:50%%; height:50%%"></div>
  <body>
</html>

推荐答案

函数updateCircle（）。

Your radius variable is local to the function updateCircle(). Make it global instead.

//Global variables
var centerlatlng = new google.maps.LatLng(-27.467726,153.026633);
var radius;


function updateCircle(){
      // do not use the 'var' keyword here
        radius = new google.maps.Circle({map: map,
                                            radius: 400,
                                            center: centerlatlng,
                                            fillOpacity: 0});}
    }

这篇关于删除谷歌地图圈内覆盖功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！