javascript - 埋め込まれたGoogleマップにハイパーリンクを介してパラメーターを渡す方法

Question

Google マップに問題があります。ハイパーリンクを介して、埋め込まれた Google マップにいくつかのパラメーター (住所といくつかのマーカー オプション) を渡す必要があります。出来ますか？

何か提案はありますか？

よろしく、

マルチェロ

Answer 1

はい ！それは簡単です。例を挙げましょう：

このスニペットは、現在の位置を取得して静的マップ V2 を作成し、半径 1 km 内に別のマーカーを描画し、それらの間に線を描画します。それがどのように機能するかを簡単に確認できます。

<script>
function showMap(position) {
var lat = Math.random()*((position.coords.latitude+0.005)-(position.coords.latitude -0.005))+(position.coords.latitude - 0.005);
var log = Math.random()*((position.coords.longitude+0.01)-(position.coords.longitude -0.01))+(position.coords.longitude - 0.01);

$('#map').css({'background-image':'url(http://maps.googleapis.com/maps/api/staticmap?center='+position.coords.latitude+','+position.coords.longitude+'&zoom=15&size=600x305&maptype=roadmap &markers=color:red%7C'+position.coords.latitude+','+position.coords.longitude+'%7C'+lat+','+log+'&path=color:0x17A689|weight:2|'+position.coords.latitude+','+position.coords.longitude+'|'+lat+','+log+'&sensor=false)','background-position':'right','background-repeat':'no-repeat'});
}

navigator.geolocation.getCurrentPosition(showMap);
</script>

スクリプトが読み込まれると、 が変更<div id="map"></div>され、リンクで指定された寸法の背景画像が割り当てられます。

引数を取得する関数を作成し、それらを使用してマップを作成できます。

https://developers.google.com/maps/documentation/staticmaps/