javascript Google Markers setVisible true/false 显示/隐藏

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/6502566/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 20:52:58  来源:igfitidea点击:

Google Markers setVisible true/false show/hide

javascriptgoogle-maps-api-3google-maps-markers

提问by Benno

Ok, so I have a google Map store locator. Input a post code, it returns stores in a radius. Got all these pretty info windows, marker icons, and can even do directions...

好的,所以我有一个谷歌地图商店定位器。输入邮政编码,它返回半径范围内的商店。获得了所有这些漂亮的信息窗口、标记图标,甚至可以做方向……

In a nutshell, I need to be able to HIDE (which I can do) all the markers before I calculate directions (because the directions api seems to automatically add its own markers which I have no idea how to override).

简而言之,在计算方向之前,我需要能够隐藏(我可以做到)所有标记(因为方向 api 似乎会自动添加自己的标记,我不知道如何覆盖)。

At the moment I'm using the following to HIDE the markers. This works 100%.It sets the visible value of the marker to false in the DOM tab of firebug and the marker icons disappear.

目前我正在使用以下内容来隐藏标记。这 100% 有效。它在 firebug 的 DOM 选项卡中将标记的可见值设置为 false,并且标记图标消失。

  function clearMarkers() {

    for (var i = 0; i < markers.length; i++) {
      markers[i].setVisible(false);
    }
  }

Now, my issue is I cannot SHOW OR unhide the markers. This is my current function. I can still click on my listing of stores and it pops up the markers infoWindow, BUT the marker just doesn't appear once its been hidden. Can anyone help me in unhiding the marker ICON in this restoreMarkers function?

现在,我的问题是我无法显示或取消隐藏标记。这是我目前的功能。我仍然可以点击我的商店列表,它会弹出标记信息窗口,但是标记一旦被隐藏就不会出现。谁能帮我在这个 restoreMarkers 函数中取消隐藏标记图标?

  function restoreMarkers() {
    for (var i = 0; i < markers.length; i++) {
      markers[i].setVisible(true);
    }
    markers.setMap(map);
  }

Here's all my code on jsFiddle if you need it

如果您需要,这是我在 jsFiddle 上的所有代码

采纳答案by Kasper Vesth

Without having tried it I can think of one possible thing that could go wrong. Is it possible that the directionsrenderer places another layer on top of the map that hides all the markers? Have you tried removing it to see whether that would bring back the markers?

没有尝试过,我可以想到一件可能出错的事情。方向渲染器是否有可能在地图顶部放置另一个图层以隐藏所有标记?您是否尝试将其移除以查看是否会带回标记?

I have used the setVisible(true) many times without any problems, so if the directionsdisplay is not the problem I am at a loss. Any chance you could link to the homepage where the code runs so we could try it out?

我已经多次使用 setVisible(true) 没有任何问题,所以如果方向显示不是问题,我会不知所措。你有没有机会链接到代码运行的主页,以便我们可以尝试一下?

回答by eyecatchUp

Just for everyone's info:

仅供大家参考:

The setMap call at the end of the restoreMarkers function is false! Without verifying, i'd bet this triggered the conflict as the object that shall be set to the map is already there - it's just not visible (imagine of the difference between display:none and visibility:hidden in CSS).

restoreMarkers 函数末尾的 setMap 调用是错误的!没有验证,我敢打赌这会触发冲突,因为应设置到地图的对象已经存在 - 它只是不可见(想象一下 display:none 和visibility:hidden 在 CSS 中的区别)。

The setVisible method affects only the visibility - not the existence. So setting setVisible to false, will not remove the marker object from the map object, but only makes it invisible.

setVisible 方法只影响可见性 - 而不是存在。因此,将 setVisible 设置为 false,不会从地图对象中删除标记对象,而只会使其不可见。

More information and detailed tutorials about toggling MVC objects and the JavaScript Maps API v3 can be found at my blog. For example check out my latest: https://bexton.net/2011/07/11/tutorial-advanced-google-maps-marker-toggle-with-jquery-and-maps-api-v3/

有关切换 MVC 对象和 JavaScript Maps API v3 的更多信息和详细教程可以在我的博客中找到。例如查看我最新的:https: //bexton.net/2011/07/11/tutorial-advanced-google-maps-marker-toggle-with-jquery-and-maps-api-v3/