1

私は少し混乱しています。Google Maps (api v.3) infoWindow のコンテンツをノードとして読み込もうとしています。コンテンツが大きい場合、予想される垂直スクロール バーが表示されず、コンテンツが情報ウィンドウからはみ出し、ユーザーが非常に混乱します。

ただし、まったく同じノードを取得し、その html 文字列表現を InfoWindow に渡すと、垂直スクロール バーでレンダリングされます。

それを説明するために jsfiddle を作成しました: http://jsfiddle.net/vEBUv/5/

これは予想される動作ですか？

提案をありがとう

ps: DOM 要素への参照を維持したいので、コンテンツを Node として渡す必要があります

jsFiddle のコード:

var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
var mapOptions = {
    zoom: 4,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
var mapNode = new google.maps.Map(document.getElementById('map_canvas_node'), mapOptions);

var contentNode = $('#infoWindowContent')[0];
var contentString = $('#infoWindowContent').parent().html();

var infowindow = new google.maps.InfoWindow({
    content: contentString
});

var infowindowNode = new google.maps.InfoWindow({
    content: contentNode
});

var marker = new google.maps.Marker({
     position: myLatlng,
     map: map,
     title: 'Test Content as String'
});

var markerNode = new google.maps.Marker({
    position: myLatlng,
    map: mapNode,
    title: 'Test Content as Node'
});

google.maps.event.addListener(marker, 'click', function() {
    infowindow.open(map,marker);
});
google.maps.event.addListener(markerNode, 'click', function() {
    infowindowNode.open(mapNode,markerNode);
});
4

1 に答える 1

2

infoWindowの -event が発生したときにoverflowcontent-nodeのparentNode の -style を設定します。autodomready

google.maps.event.addListener(infowindowNode,'domready',function(){
  this.getContent().parentNode.style.overflow='auto';
});

http://jsfiddle.net/doktormolle/7HdKt/

于 2013-02-07T14:35:57.857 に答える