Question

我真的很感激这个问题的一些帮助。它可能很容易解决，但我无法弄清楚如何编码。我有一张基于此Geocodezip Example Categories的地图，它显示标记并在其旁边有一个侧边栏。标记属于三个类别之一，并根据是否选中复选框，标记将显示在地图上。

    function show(category) {
        for (var i=0; i<gmarkers.length; i++) {
            if (gmarkers[i].mycategory == category) {
                gmarkers[i].setVisible(true);
            }
        }
        document.getElementById(category+"box").checked = true;
    }

    function hide(category) {
        for (var i=0; i<gmarkers.length; i++) {
            if (gmarkers[i].mycategory == category) {
                gmarkers[i].setVisible(false);
            }
        }
        document.getElementById(category+"box").checked = false;
        infowindow.close();
    }

同时，我正在尝试显示标记＆＃39;侧边栏中的信息，但在两个条件下：

必须检查标记类别＆amp;
标记必须包含在地图视口/边界

然后，我为侧边栏添加了一个代码，该代码仅显示已检查类别的标记，以及当标记位于视口中时信息显示在侧边栏中的一个代码。但是，我只能单独执行这些操作（对于完全不同的代码），并且无法同时使用这两个条件。这些是我尝试合并的两个例子：

如果选中框，则包含在侧栏中

function makeSidebar() {
    var side_bar_html = "";
    for (var i=0; i<gmarkers.length; i++) {
        if (gmarkers[i].getVisible()) {
            side_bar_html += '<a href="javascript:myclick(' + i + ')">' + gmarkers[i].myname + '<\/a><br>';
        }
    }
    document.getElementById("side_bar").innerHTML = side_bar_html;
}

（当边界发生变化时）如果标记包含在边界

中，则包括在侧边栏中

function makeSidebar() {
    google.maps.event.addListener(map, 'bounds_changed', function() {
        var side_bar_html = "";
        var bounds = map.getBounds();       
        for (var i=0; i<gmarkers.length; i++) {
            if (bounds.contains(gmarkers[i].position)) {
                side_bar_html += '<a href="javascript:myclick(' + i + ')">' + gmarkers[i].myname + '<\/a><br>';
            }
        }
        document.getElementById("side_bar").innerHTML = side_bar_html;  
    });
}

我尝试将两者放在if bounds.contains语句中的组合if语句（＆amp;＆amp;）中，但如果选中/取消选中某个框，则侧栏不会改变。

Answer 1

仅在地图边界可用时才将检查添加到makeSidebar：

  // == rebuilds the sidebar to match the markers currently displayed ==
  function makeSidebar() {
    var html = "";
    for (var i=0; i<gmarkers.length; i++) {
      if (gmarkers[i].getVisible()  && 
          map.getBounds && 
          map.getBounds() && 
          map.getBounds().contains(gmarkers[i].getPosition())) {
        html += '<a href="javascript:myclick(' + i + ')">' + gmarkers[i].myname + '<\/a><br>';
      }
    }
    document.getElementById("side_bar").innerHTML = html;
  }

在bounds_changed事件触发时执行makeSidebar：

google.maps.event.addListener(map, 'bounds_changed', makeSidebar);

working fiddle

侧栏显示当前显示的标记 - 组合IF语句

1 个答案: