Question

我有这个谷歌地图javascript代码的愚蠢艰难时期。我想获得在谷歌地图上生成的圆的半径的返回。谷歌API提供代码，但我不知道在哪里放。我到处尝试过。这是下面的代码。我做错了什么？

<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="initial-scale=1.0, user-scalable=no">

<meta charset="utf-8">

<style type="text/css"> 
 html { height: 100% }
 body { height: 100%; margin: 0px; padding: 0px }
 #map_canvas { height: 50% }
</style> 

<script type="text/javascript"
  src="http://maps.googleapis.com/maps/api/js?key=mykey&sensor=false&libraries=drawing">
</script>

<script>
  function initialize() {
    var mapOptions = {
      center: new google.maps.LatLng(33.65, -84.42),
      zoom: 7,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(document.getElementById('map_canvas'),
      mapOptions);

    var drawingManager = new google.maps.drawing.DrawingManager({
      drawingMode: google.maps.drawing.OverlayType.MARKER,
      drawingControl: true,
      drawingControlOptions: {
        position: google.maps.ControlPosition.TOP_CENTER,
        drawingModes: [

          google.maps.drawing.OverlayType.CIRCLE
        ]
      },

      circleOptions: {
        fillColor: '#01939A',
        fillOpacity: .4,
        strokeWeight: 5,
        clickable: false,
        editable: true,
        zIndex: 1
      }
    });




    drawingManager.setMap(map);





     }

  google.maps.event.addDomListener(window, 'load', 

  initialize).addListener(drawingManager, 'circlecomplete', function(circle) 

  {

  var radius = circle.getRadius();

  });

</script>

</head>

<body>

<script type="text/javascript" >

        alert(radius);

</script>


<div id="map_canvas"></div>

</body>

</html>

Answer 1

这里似乎有一些流动问题。尝试使用由初始化函数绑定的drawingManager变量。

这里：http://jsfiddle.net/RN3QL/ - 我已经将圆圈完成函数的绑定移动到初始化函数中，并修复了一些较小的流程问题。

谷歌地图得到半径

1 个答案: