Question

这是问题所在。

我需要制作一个包含多个标记的Google地图。
每个标记都有一个不同内容的信息窗口。当您在3秒后打开网站时，infowindow会随机标记弹出。
然后关闭，3秒后，infowindow弹出窗口形成另一个随机标记，依此类推。
此外，infowindow需要自动显示而不是点击标记

我需要做什么？

Answer 1

很容易。首先，您需要设置一个包含多个标记的地图，将所有这些标记存储在一个数组中，然后使用setInterval触发点击事件。

HTML：

<div>
    <div id="map" style="width: 500px; height: 400px;"></div>
    <script src="http://maps.google.com/maps/api/js?sensor=false"></script>
</div>

JS：

//Define markers attribute
var locations = [
    [
        "New Mermaid",
    36.9079, -76.199,
    1,
        "Georgia Mason",
        "",
        "Norfolk Botanical Gardens, 6700 Azalea Garden Rd.",
        "coming soon"],
    [
        "1950 Fish Dish",
    36.87224, -76.29518,
    2,
        "Terry Cox-Joseph",
        "Rowena's",
        "758 W. 22nd Street in front of Rowena's",
        "found"],
    [
        "A Rising Community",
    36.95298, -76.25158,
    3,
        "Steven F. Morris",
        "Judy Boone Realty",
        "Norfolk City Library - Pretlow Branch, 9640 Granby St.",
        "found"],
    [
        "A School Of Fish",
    36.88909, -76.26055,
    4,
        "Steven F. Morris",
        "Sandfiddler Pawn Shop",
        "5429 Tidewater Dr.",
        "found"],
    [
        "Aubrica the Mermaid (nee: Aubry Alexis)",
    36.8618, -76.203,
    5,
        "Myke Irving/ Georgia Mason",
        "USAVE Auto Rental",
        "Virginia Auto Rental on Virginia Beach Blvd",
        "found"]
]

//Set up map.
var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 12,
    // center: new google.maps.LatLng(-33.92, 151.25),
    center: new google.maps.LatLng(36.8857, -76.2599),
    mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
var markers = [];
for (i = 0; i < locations.length; i++) {
    marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map
    });
    markers.push(marker); // Store the markers in an array.
    google.maps.event.addListener(marker, 'click', (function (marker, i) {
        return function () {
            infowindow.setContent(locations[i][0], locations[i][6]);
            infowindow.open(map, marker);
        }
    })(marker, i));
}
var i = 0;
setInterval(function () {
    if (i == markers.length) i = 0;
    google.maps.event.trigger(markers[i], 'click'); // Trigger click on marker after 3s
    i++;
}, 3000);

演示：http://jsfiddle.net/lotusgodkk/pGBZD/153/ //对于连续订单

演示：http://jsfiddle.net/lotusgodkk/pGBZD/154/ //对于随机顺序

谷歌地图 - 每3秒随机标记一次信息弹出窗口

1 个答案: