在Google Map V3 API js中圈覆盖 [英] Circle overlay in Google Map V3 API js

问题描述

我试图在谷歌地图上插入这个圆圈，通过在标题中包含以下js文件，地图显示正常;

I am trying to insert this circle on a google map, the map displays fine by including the following js file in the header;

/**
       * Called on the intiial page load.
       */
      function initialize() {
        var latLng = new google.maps.LatLng(50.272213,-5.054973);
        var options = {
          'zoom': 9,
          'center': latLng,
          'mapTypeId': google.maps.MapTypeId.ROADMAP
        };

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

      }

      // Register an event listener to fire when the page finishes loading.
      google.maps.event.addDomListener(window, 'load', initialize);

但是，当我添加以下内容来包含它打破的圆形并且不加载;

But when i add the following to include the circle it breaks and doesn't load;

 /**
       * Called on the intiial page load.
       */
      function initialize() {
        var latLng = new google.maps.LatLng(50.272213,-5.054973);
        var options = {
          'zoom': 9,
          'center': latLng,
          'mapTypeId': google.maps.MapTypeId.ROADMAP
        };

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

        // Add a Circle overlay to the map.
            var circle = new google.maps.Circle({
            map: map,
            center: new google.maps.LatLng(50.272213,-5.054973),
            fillColor: #00FF00,
            fillOpacity: 0.2,
            strokeColor: #00FF00,
            strokeOpacity: 0.4,
            strokeWeight: 2
            });
            circle.setRadius(18362.55489862987);

      }

      // Register an event listener to fire when the page finishes loading.
      google.maps.event.addDomListener(window, 'load', initialize);

如果有人能指出即将出错的地方，请... ...

If somebody could point out where im going wrong please...

推荐答案

尝试将侦听器代码更改为：

Try changing your listener code to this:

google.maps.event.addDomListener(window, 'onload', initialize()); 

下面是一个工作示例： http://jsfiddle.net/pVh3b/1/

Here is a working example: http://jsfiddle.net/pVh3b/1/

这篇关于在Google Map V3 API js中圈覆盖的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！