6

Google プレイス ライブラリを使用して Google マップを実装するフォームがあります ( demo、余談ですが、JSFiddle では、gmaps.js をスクリプト参照として追加すると機能しませんが、スクリプト要素として追加するとHTML セクションはまったく同じスクリプトで正常に動作します)、次のようになります。

<form action="#" method="post">
  <table class='Information table table-bordered'>
    <caption>Information</caption>
    <colgroup>
      <col width='100' />
      <col/>
    </colgroup>
    <tbody>
      <tr>
        <th>Location</th>
        <td>
          <div class="input-append">
            <input type="text" name="Lat" value="37.771424" />
            <span class="add-on">lat.</span>
          </div>
          <div class="input-append">
            <input type="text" name="Lng" value="-122.41332799999998" />
            <span class="add-on">lng.</span>
          </div>
        </td>
      </tr>
      <tr>
        <th>Map</th>
        <td>
          <div id="panel">
            <form class="form-search">
              <input type="text" class="input-medium search-query" autocomplete="off" id="target" placeholder="Search Box"/>
            </form>
          </div>
         <div id="ScavengerMap"></div>
        </td>
      </tr>
    </tbody>
  </table>
</form>

次の JavaScript を使用します。

var input = document.getElementById('target'),
  searchBox = new google.maps.places.SearchBox(input),
  map = new GMaps({
    div: '#ScavengerMap',
    lat: 37.771424,
    lng: -122.41332799999998
  });
google.maps.event.addListener(searchBox, 'places_changed', function () {
  var places = searchBox.getPlaces(),
    location;
  if (places.length > 0) {
    location = places[0].geometry.location;
    map.removeMarkers();
    map.setCenter(location.jb, location.kb);
    map.addMarker({
      lat: location.jb,
      lng: location.kb,
      title: "Slim\'s",
      draggable: true,
      dragend: function (e) {
          var point = e.latLng;
          $('input[name=Lat]').val(point.lat());
          $('input[name=Lng]').val(point.lng());
      }
    });
    $('input[name=Lat]').val(location.jb);
    $('input[name=Lng]').val(location.kb);
  }
});

map.addMarker({
  lat: 37.771424,
  lng: -122.41332799999998,
  title: "Slim\'s",
  draggable: true,
  dragend: function (e) {
    var point = e.latLng;
    $('input[name=Lat]').val(point.lat());
    $('input[name=Lng]').val(point.lng());
  }
});

検索ボックスに「Slim's」などと入力すると、Google プレイス ライブラリからの候補が表示されます。いずれかを選択すると、その場所にマーカーが描画されるはずですが、代わりに次の 2 つのエラーが発生します。

too much recursion
[Break On This Error]   

...))};sa(fg[E],function(a){var b=this.ua,c=Sf(a);b[c]&&(delete b[c],O[m](this,vf,a...

{main,places}.js (line 26)
too much recursion
[Break On This Error]   

....route=function(a,b){Mf("directions",function(c){c.pi(a,b,!0)})};function P(a,b,...

私がうまくいくのに苦労しているのは、その理由です。このデモにあるコードは私のプロジェクトのコードのサブセットですが、どちらも同じ問題を示しています。Google Places Library や Google Maps API の機能停止に関する情報が見つかりません。さらに奇妙なことに、このまったく同じコードが 2 週間前 (私が書いたとき) には機能していました。少なくとも問題を特定する方法についてのアイデアはありますか?

4

2 に答える 2

2

私はそれを理解したように見えます。プロパティ.jbと.kb名前が変更されたようです。latandを取得する正しい方法は、オブジェクトに対してandをlng呼び出すことです。例に厳密に従うための私の間違い:).lat().lng()places[0].geometry.location

于 2013-08-07T00:42:27.967 に答える
1

ズーム設定についても確認できます。ズーム設定の数値がない場合、この問題が発生します。

于 2014-10-24T03:22:32.000 に答える