web-dev-qa-db-ja.com

マーカーを使用してGoogleマップから緯度/経度座標を取得します

誰もが次のことを行う簡単なスクリプトが利用できることを知っているのかと思っただけです。

ビューにGoogleマップをロードし、クリックすると緯度と経度の値を変数に保存するマーカーが表示されますか？

このようなものが既にPHPに存在するかどうかは誰にもわかりますか？

前もって感謝します

javascriptphpgoogle-mapsgoogle-maps-api-3
18
Zabs

おそらくあなたはこれに似たものを探しています Latitude-Longitude Finder Tool 。サンプルコード は API v2でした。以下は、Google Maps API v3を使用したコードの短縮バージョンです。

var latlng = new google.maps.LatLng(51.4975941, -0.0803232);
var map = new google.maps.Map(document.getElementById('map'), {
    center: latlng,
    zoom: 11,
    mapTypeId: google.maps.MapTypeId.ROADMAP
});
var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    title: 'Set lat/lon values for this property',
    draggable: true
});
google.maps.event.addListener(marker, 'dragend', function(a) {
    console.log(a);
    // bingo!
    // a.latLng contains the co-ordinates where the marker was dropped
});

デモ

説明：マーカーの draggable プロパティをtrueに設定する必要があります。その後、コールバック関数をそのマーカーのdragendイベントにフックできます。新しい座標は関数に渡され、JavaScript変数またはフォームフィールドに割り当てることができます。

29
Salman A
// add a click event handler to the map object
    GEvent.addListener(map, "click", function(overlay, latLng)
    {
        // display the lat/lng in your form's lat/lng fields
        document.getElementById("latFld").value = latLng.lat();
        document.getElementById("lngFld").value = latLng.lng();
    });

緯度経度を取得したら、マーカーを配置できると思います。

6
Code Lღver

Google maps API v.3をご覧ください。 イベントページ から：

 google.maps.event.addListener(map, 'click', function(event) {
   // use event.latLng to place a google.maps.Marker
 });
5
ori

以下のコードはうまく機能します

var latlng = new google.maps.LatLng(51.4975941, -0.0803232);
var map = new google.maps.Map(document.getElementById('map'), {
    center: latlng,
    zoom: 11,
    mapTypeId: google.maps.MapTypeId.ROADMAP
});
var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    title: 'Set lat/lon values for this property',
    draggable: true
});

google.maps.event.addListener(marker, 'dragend', function (event) {
    document.getElementById("latbox").value = this.getPosition().lat();
    document.getElementById("lngbox").value = this.getPosition().lng();
});
3
Rolwin C

私はこれまでのところ以下を管理しました-地図上のどこかをクリックしたときにマーカーの位置を移動するためにこれをどのように修正できますか

http://jsfiddle.net/ZW9jP/

以下を追加しましたが、何もしないようです

google.maps.event.addListener(map, 'click', function(event) {
  addMarker(event.latLng);
});
3
Zabs