Google Maps v3 - 将Circle设置为setPosition(位置)

时间:2013-12-10 20:09:38

标签: javascript google-maps

尝试使用场所库创建一个围绕搜索位置的静态半径的圆圈。与此working example类似。唯一的区别是我只需要将圆半径设为静态。

这是我尝试过的(我是gmaps的新手):

var mapOptions = {
    center: new google.maps.LatLng(37.7831,-122.4039),
    zoom: 12,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
    var acOptions = {
      types: ['establishment']
    };
    var autocomplete = new google.maps.places.Autocomplete(document.getElementById('autocomplete'),acOptions);
    autocomplete.bindTo('bounds',map);
    var infoWindow = new google.maps.InfoWindow();

    var CircleOptions = {
      strokeColor: '#FF0000',
      strokeOpacity: 0.8,
      strokeWeight: 2,
      fillColor: '#FF0000',
      fillOpacity: 0.35,
    };
    var cityCircle = new google.maps.Circle(CircleOptions);

    google.maps.event.addListener(autocomplete, 'place_changed', function() {
      infoWindow.close();
      citycircle.close();
      var place = autocomplete.getPlace();
      if (place.geometry.viewport) {
        map.fitBounds(place.geometry.viewport);
      } else {
        map.setCenter(place.geometry.location);
        map.setZoom(17);
      }
      infoWindow.setContent('<div><strong>' + place.name + '</strong><br>');
      infoWindow.setPosition(place.geometry.location);
      infoWindow.open(map);
      cityCircle.setPosition(infoWindow);
    });

1 个答案:

答案 0 :(得分:1)

以下代码不正确。 .setPosition方法需要google.maps.LatLng对象,而不是infoWindow。您应该从API中收到javascript错误或消息。

cityCircle.setPosition(infoWindow);

这应该有效(圆圈没有位置,它有一个中心):

cityCircle.setCenter(place.geometry.location);

您还需要定义圆的半径。

working example