3

以下の URL の次のスクリプトで生成された Google マップがあります。

http://apryll.co.in/maps/index.php



    変数の場所 = [
      ['', -33.890542, 151.274856, 4],
      ['', -33.923036, 151.259052, 5],
      [''、-34.028249、151.157507、3]、
      ['', -33.80010128657071, 151.28747820854187, 2],
      [''、-33.950198、151.259302、1]
    ];

    var map = new google.maps.Map(document.getElementById('map'), {
      ズーム: 10,
      中央: 新しい google.maps.LatLng(-33.92, 151.25),
      mapTypeId: google.maps.MapTypeId.ROADMAP

    });

    var flagIcon_front = new google.maps.MarkerImage("images/marker.png");

    var flagIcon_shadow = new google.maps.MarkerImage("images/marker_shadow.png")
    flagIcon_shadow.size = 新しい google.maps.Size(105, 53);
    flagIcon_shadow.anchor = 新しい google.maps.Point(20, 52);

    var boxText = document.createElement("div");
        boxText.style.cssText = "border: 1 ピクセルの純黒; margin-top: 8 ピクセル; パディング: 5 ピクセル; display:block; ";                                                              

        var myOptions = {
             内容:ボックステキスト
            ,disableAutoPan: false
            、最大幅: 0
            ,pixelOffset: 新しい google.maps.Size(-261, -268)
            、zIndex: null
            ,boxStyle: {
              背景: "url('images/metro-plot-bg-1.png') no-repeat -286px -1361px"
              、不透明度: 1
              ,幅: "393px"
              ,高さ: "233px"
             }
            ,closeBoxMargin: "11px 32px 2px 2px"
            ,closeBoxURL: "images/close.png"
            ,infoBoxClearance: 新しい google.maps.Size(1, 1)
            ,isHidden: false
            、ペイン: "floatPane"
            、enableEventPropagation: false

        };

    var infowindow = 新しい google.maps.InfoWindow();

    var マーカー、i;

    for (i = 0; i<locations.length; i++) {  
      マーカー = 新しい google.maps.Marker({
        位置: 新しい google.maps.LatLng(場所[i][1], 場所[i][2]),
        アイコン: flagIcon_front,
        影: flagIcon_shadow,         
        マップ: マップ
      });

      google.maps.event.addListener(marker, 'click', (function(marker, i) {
        関数を返す() {
          //infowindow.setContent(locations[i][0]);
          //infowindow.open(地図、マーカー);
          ib.setContent(場所[i][0]);
          ib.open(地図、マーカー);
        }
      })(マーカー、i));
      var ib = 新しい InfoBox(myOptions);
        //ib.open(マップ、マーカー);
    }
     

別の場所を選択するためのページにドロップダウンがあります。

http://apryll.co.in/maps/index.php

[選択] ドロップダウンを選択すると、ajax 呼び出しに対する応答として、別の場所の緯度と経度が表示されます。

今、応答テキストで新しく受け取った緯度と経度を使用してGoogleマップを再描画したい

事前に感謝します

4

4 に答える 4

3
Latlng = new google.maps.LatLng(some_lat,some_lon);
map.panTo(Latlng);

使用することもできます

map.setCenter(Latlng);

違いは、元の緯度と経度が新しい緯度と経度に十分近い場合、panTo は適切なアニメーションでそれを行うことです。

こちらのドキュメントをご覧ください: https://developers.google.com/maps/documentation/javascript/reference

于 2015-06-17T13:56:42.683 に答える
3

PHPの知識がないので、サンプルコードを提供することはできませんが、これはあなたができることです-

コンボボックスから選択する際にデータベースから緯度経度を取得しているため、この機能を追加することもできます。

まず、マーカー配置コードを別の関数に移動する必要があります。データベースから取得した値は、配列に渡す必要があります。この配列は、この関数でのみ宣言してください。次に、この配列を使用してマーカーを配置できます。これは、コンボ ボックスで選択が変更されるたびにこの関数が実行されるためです。

この私の質問でいくつかの Asp.net コードを見ることができます。お役に立てば幸いです。

于 2012-10-30T05:37:07.113 に答える