[解決済み] Google マップでポイントの周囲に半径を描画する

質問

Google Maps API を使用しており、マーカーを追加しました。現在、各マーカーの周囲に半径 10 マイル、つまり、ズーム中に適切に動作する円を追加したいと思っています。それを行う方法がまったくわかりませんし、一般的なものでもないようです。

私は良さそうな 1 つの例を見つけました。 Google Latitudeも見てみてください。そこでは、私が望むように、半径のあるマーカーが使用されています。

更新しました。 Google Latitudeは 画像 を使用していますが、これはどのように機能するのでしょうか？ _{^{(非推奨の機能)}}

どのように解決するのですか？

Google Maps API V3を使ってCircleオブジェクトを作成し、bindTo()を使ってMarkerの位置に結びつけます（どちらもgoogle.maps.MVCObjectインスタンスであるため）。

// Create marker 
var marker = new google.maps.Marker({
  map: map,
  position: new google.maps.LatLng(53, -2.5),
  title: 'Some location'
});

// Add circle overlay and bind to marker
var circle = new google.maps.Circle({
  map: map,
  radius: 16093,    // 10 miles in metres
  fillColor: '#AA0000'
});
circle.bindTo('center', marker, 'position');

fillColor、strokeColor、strokeWeightなどを変更すれば、Google Latitudeのサークルと同じような見た目にすることができます( フルAPI ).

もっと見る ソースコードとスクリーンショット例 .