自动调整Google地图上的InfoWindow位置

时间:2011-11-05 00:35:07

标签: javascript google-maps infowindow

我使用自定义InfoWindows的Google Maps v3获得了Django模板。在鼠标悬停事件中,JavaScript绘制我的InfoBox窗口,然后在地图上自动调整它的位置。地图移动到窗口显示的位置,没有重叠。如何禁用调整?

       var latlng = new google.maps.LatLng(47.517201, 7.03125);


        var map_options = {
            zoom: 2,
            center: latlng,
            scrollwheel: false,
            mapTypeControl: false,
            streetViewControl: false,
            overviewMapControl: false,
            zoomControlOptions: {
                    style: google.maps.ZoomControlStyle.SMALL 
            },
            mapTypeId: google.maps.MapTypeId.TERRAIN,
        };

        var map = new google.maps.Map(document.getElementById("map"), map_options);

        google.maps.event.addListener(map, 'zoom_changed', function() {
            map.setOptions({scrollwheel: true});
        });

        var fm_infowindow = new Array();
        var am_infowindow = new Array();
        var pm_infowindow = new Array();

        {% for object in future_object_list %}
            var fm_latlng_{{ forloop.counter }} = new google.maps.LatLng({{object.abscissa}}, {{object.ordinate}});
            var futuremap_{{ forloop.counter }} = new google.maps.Marker({
                position: fm_latlng_{{ forloop.counter }},
                    map: map,
                    icon: '/media/images/dot-green.png',
            });

            fm_infowindow[{{ forloop.counter }}] = new InfoBox({
                content: "<div style='width: 150px; float: left;'><img src='{% thumbnail object.photo 150x98 crop %}' alt='{{ object.title }}' /></div><div style='width: 150px; float: left; padding-left: 5px; font-size: 11px;'><b>{{ object.title }}</b><br /><br />{{ object.country.name }}, <nobr>{{ object.date|date:"F Y" }}</nobr><br /><br />{{ object.info }}</div>",
                boxStyle: { 
                    background: "url('/media/images/black_arrow_big.png') no-repeat",
                            width: "310px",
                    height: "165px",
                    padding: "40px 30px 10px 30px",
                    margin: "0px 0px 0px -185px",
                        },
                closeBoxURL: '',
                alignBottom: true,
            });

            google.maps.event.addListener(futuremap_{{ forloop.counter }}, 'mouseover', function() {
                am_infowindow[1].close();
                fm_infowindow[{{ forloop.counter }}].open(map, futuremap_{{ forloop.counter }});
            });
            google.maps.event.addListener(futuremap_{{ forloop.counter }}, 'mouseout', function() {
                fm_infowindow[{{ forloop.counter }}].close(map, futuremap_{{ forloop.counter }});
            });

        {% endfor %}

1 个答案:

答案 0 :(得分:1)

http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/docs/examples.html

我正在使用该库,它的属性“disableAutoPan”为InfoWindow。