0

goolge maps 4 rails gem を使用しています。

マウスオーバーでマーカーごとに情報ウィンドウを開き、マウスアウトで閉じるようにしています。infowindow.open が機能しません。

次のコードを使用すると、次のようになります: Uncaught ReferenceError: infowindow is not defined. 私は何を間違っていますか？これは、このリスナーを追加する適切な場所ですか?コードを保存する組み込みメソッドはありますか?

<script type="text/javascript">

handler = Gmaps.build("Google", 
  { markers: 
    { clusterer: { 
        gridSize: 8,
        maxZoom: 12,
        styles: [ {
              textSize: 1,
              textColor: '#45A6DD',
              url: 'images/mapCluster.png',
              height: 51,
              width: 51 }      
            ]
      }
    } 
});

var image = 'images/marker.png';

handler.buildMap({
    provider: {
      zoom: 4,
      minZoom: 4,
      maxZoom: 13,
      draggable: true, 
      zoomControl: true, 
      scrollwheel: false, 
      disableDoubleClickZoom: true,
      disableDefaultUI: true,
      center: new google.maps.LatLng(37.8282, -98.5795),
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      styles: Maps.styles,
      zoomControlOptions: {
        style: google.maps.ZoomControlStyle.SMALL
      }
    },
    internal: {
      id: 'map'
    }
  },
  function(){
    markers = handler.addMarkers(<%=raw @hash.to_json %>);
    handler.bounds.extendWith(markers);
    for (i = 0, len = markers.length; i < len; i++) {
      marker = markers[i].getServiceObject();
      google.maps.event.addListener(marker, 'mouseover', function() {
        infowindow.serviceObject.open(Gmaps.map.map, marker.serviceObject);
      });

    }
  }
);

</script>

関連するかどうかはわかりませんが、コントローラーアクションを介して渡すハッシュは次のとおりです。

@hash = Gmaps4rails.build_markers(@cities_for_map) do |city, marker|
  marker.infowindow render_to_string(:partial => "/destinations/map_tile.html", :locals => { :city => city})
  marker.lat city.latitude
  marker.lng city.longitude
  marker.picture({ 
    "url" => "/images/Marker.png",
    "width" => 20,
    "height" => 20 })
end

スクリプトに以下を追加しました

クラス @MyMarker は Gmaps.Google.Builders.Marker を拡張します

  create_infowindow_on_click: ->
    @addListener 'mouseover', @infowindow_binding

そして私のハンドラーを更新しました：

handler = Gmaps.build("Google",
      { markers: 
        { clusterer: { 
            gridSize: 8,
            maxZoom: 12,
            styles: [ {
                  textSize: 1,
                  textColor: '#45A6DD',
                  url: 'images/maps/cluster.marker.png',
                  height: 51,
                  width: 51 }      
                ]
          }
        },
        builders: {
          Marker: KhMarker
        }
    });

それは今動作します:)

4

1 に答える 1

0

Indeedinfowindowはコードで定義されていません。

infowindows の操作は、マーカー ビルダーで行う必要があります。基本的には、ここでメソッドをオーバーライドします。

# in a coffee file
class @YourBuilder extends Gmaps.Google.Builders.Marker # inherit from base builder

  create_infowindow_on_click: ->
    google.maps.event.addListener @serviceObject, 'mouseover', @infowindow_binding

# then pass your builder when you create one handler
handler = Gmaps.build 'Google', { builders: { Marker: YourBuilder } }
于 2014-05-15T06:42:20.383 に答える