質問編集履歴

1 コードブロック化

shaak

shaak score 581

2017/01/26 19:03  投稿

GoogleMapApi Geocode マーカー
###前提・実現したいこと
GoogleMapApiを使用しています。
住所情報をもとにGeocodeでlatlngを取得し、複数マーカーを表示したいと考えています。
###発生している問題・エラーメッセージ
10件までは表示できるのですが、それ以上件数があるとエラーになってしまいます。
```
エラーメッセージ
Uncaught TypeError: Cannot read property '0' of null
```
###該当のソースコード
```  
var addresses = [
['横浜市中区伊勢佐木町1-4-4','ABC-MART イセザキモール店'],['横浜市中区伊勢佐木町1-5-3','カステラの横濱文明堂'],['横浜市中区伊勢佐木町2-60','花見煎餅吾妻屋総本店'],['横浜市中区伊勢佐木町1-6-5','ヴィドフランス伊勢佐木町店'],['横浜市中区伊勢佐木町1-2-1','ワールドフーズいせ一'],['横浜市中区伊勢佐木町1-4-4','ABC-MART イセザキモール店'],['横浜市中区伊勢佐木町1-5-3','カステラの横濱文明堂'],['横浜市中区伊勢佐木町2-60','花見煎餅吾妻屋総本店'],['横浜市中区伊勢佐木町1-6-5','ヴィドフランス伊勢佐木町店'],['横浜市中区伊勢佐木町1-2-1','ワールドフーズいせ一'],['横浜市中区伊勢佐木町1-4-4','ABC-MART イセザキモール店'],['横浜市中区伊勢佐木町1-5-3','カステラの横濱文明堂'],['横浜市中区伊勢佐木町2-60','花見煎餅吾妻屋総本店'],['横浜市中区伊勢佐木町1-6-5','ヴィドフランス伊勢佐木町店'],['横浜市中区伊勢佐木町1-2-1','ワールドフーズいせ一']
];
 addresses.map(function(address, i){
       geocoder.geocode({'address' : address[0]}, function(results, status){
           var position = results[0].geometry.location;
           var marker = new google.maps.Marker({
               position: position,
               map: map
           });
           var content = '<p>'+addresses[i][1] + '<br>' + addresses[i][0]+'</p>'+'<br>'+ '<a href="' + urls[i] +'">店舗ページへ<a>' ;
           var infoWindow = new google.maps.InfoWindow({
               content: content,
               position: position,
               size: new google.maps.Size(50,50)
           });
       google.maps.event.addListener(marker, 'click', function(){
           infoWindow.open(map, marker);
          if (currentInfoWindow) {
           currentInfoWindow.close();
       }
 
       currentInfoWindow = infoWindow;
       
       });
     bounds.extend(position);
     map.fitBounds(bounds);
map.setZoom(16);
   
       if(addresses.length === 1) map.setZoom(18);
         
     });
 
 
   });
```
###試したこと
色々調べた結果、Geocodeでは一度に10件以上投げるとハングするといった文献は見つけました。
都度Geocodeする必要は無いのですが、予めLatlangを住所から取得して格納して置く方法などあるのでしょうか?
###補足情報(言語/FW/ツール等のバージョンなど
MTにてカスタムフィールドから住所を取得し、Map.jsファイルをMtから排出。
Webページにてmap.jsを読み込み、Mapを描画しています。
どうぞよろしくお願いいたします。
  • Geolocation

    31 questions

    Geolocation(ジオロケーション)は、携帯電話やインターネットに接続したコンピューターターミナルなど、オブジェクトの現実世界での地理的位置の情報を扱う技術であり、位置評価の実施や、実際に評価された位置を示す場合もあります。

  • Google マップ

    433 questions

    Google Mapは、Google社がオンラインで提供している地図・ローカル検索サービスです。GIS(Geographic Information System:地理情報システム)の中の「WebGIS」に該当します。地図・航空写真・地形の表示方式があり、それぞれユーザーが縮尺を調整して表示させることができます。地域の情報サービスを検索する機能やルート検索の機能も搭載されています。

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る