Google マップにマーカーと同心円を入れたい
2回目の質問です。前回の掲載期間で、解決できなかったため。
超初心者的質問ですが、教えてください。
Google マップのある地点を中心に、
マーカーと1km/5km/10kmなどの同心円（半透明で外側ライン）の2種を表示をしようとしています。
おのおの単独で表示することは、例がありわかりましたが、
その2つを同時に表示するために、scriptを変更するのがわかりません。
1. マーカーを表示するscript
<script src="http://maps.google.com/maps?file=api&v=2&key=[あなたのAPIキー]" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
//地図を作成
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng( 緯度 , 経度 ), 地図サイズ );
//マーカーを追加(国会議事堂)
var marker = new GMarker(new GLatLng( 緯度 , 経度 ));
map.addOverlay(marker);
}
}
//]]>
</script>
2. 同心円を表示するscript
<script type='text/javascript' src='http://maps.google.com/maps/api/js?sensor=false'></script>
<div id='map' style='width:700px; height:400px;'><br /></div>
<script type="text/javascript">
var myLatLng = new google.maps.LatLng( 緯度 , 経度 );
var myMap = new google.maps.Map(document.getElementById('map'), {
zoom: 地図サイズ,
center: myLatLng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
scaleControl: true,
scrollwheel: false
});
new google.maps.Circle({
center: myLatLng, // 中心点(google.maps.LatLng)
fillColor: '#ff0000', // 塗りつぶし色
fillOpacity: 0.5, // 塗りつぶし透過度（0: 透明 ⇔ 1:不透明）
map: myMap, // 表示させる地図（google.maps.Map）
radius: 95330, // 半径（ｍ）
strokeColor: '#ff0000', // 外周色
strokeOpacity: 1, // 外周透過度（0: 透明 ⇔ 1:不透明）
strokeWeight: 1 // 外周太さ（ピクセル）
});
</script>
この2ヶのscriptをどのようにつなげば、解決できるか教えてください。
JavaScriptの基本知識不足のため、書いていただければ助かります。
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/spn/images/related_qa/c205_2_thumbnail_img_sm.png)
補足
ご指導ありがとうございます。 詳細を明記します。 入力フォームに緯度・経度情報をいれると、ホームページにグーグルマップにピンがつくという仕組みでシステムを作りました。 ここまではいいのですが、先方の要求だとピンではなく面で表示する時があるので面で表示するようにしてほしいとのことでした。グーグルマップに〇〇市〇〇１－１－１と入れるのではなく、〇〇市〇〇１といれて検索すると、確かにピンではなく、エリアで表現されて出てきます。これをやるには、緯度と経度の情報をいれるだけではできないのですが、どのようにして行えばよいかわかりませんでした。何かよい方法をお持ちの方は教えていただけないでしょうか？