Google maps api 3 右侧面板中的Google store locator库限制标记

Google maps api 3 右侧面板中的Google store locator库限制标记,google-maps-api-3,Google Maps Api 3,我想将地图右侧面板中出现的标记数量限制在任何缩放级别下的10个左右 如何做到这一点 可以在此处找到该库和示例: 我遵循此处给出的代码示例: 这里有一个代码参考: 但我仍然不清楚如何定制我下面的示例,使其在任何时候最多只能显示10个标记 编辑:我为什么要这样做 我向许多沙龙批发一种产品。通过这张地图,我试图向顾客展示他们可以去哪些沙龙购买我提供的产品 然而,在谷歌给出的例子中,沙龙的完整列表显示为地图上的标记。这是不好的,因为这样一来,竞争对手就有可能收集到他们可以向其销售竞争产品的沙龙的完

我想将地图右侧面板中出现的标记数量限制在任何缩放级别下的10个左右

如何做到这一点

可以在此处找到该库和示例:

我遵循此处给出的代码示例:

这里有一个代码参考:

但我仍然不清楚如何定制我下面的示例,使其在任何时候最多只能显示10个标记

编辑:我为什么要这样做

我向许多沙龙批发一种产品。通过这张地图,我试图向顾客展示他们可以去哪些沙龙购买我提供的产品

然而,在谷歌给出的例子中,沙龙的完整列表显示为地图上的标记。这是不好的,因为这样一来,竞争对手就有可能收集到他们可以向其销售竞争产品的沙龙的完整列表

我想要的解决方案是,根据最接近输入地址的位置,一次最多显示10个标记

对于我来说,示例()总是在面板中最多显示10个条目。硬编码限制为10,因此如果不修改
store locator.min.js

但当您不想显示少于10个条目时,可以通过CSS:

/* limit the displayed entries to 5 */
.store-list li:nth-child(n+6){display:none}

当你想应用一个更高的限制时(或者当它应该与IE兼容时),有一些通用的方法,更好的解决方案取决于你拥有的商店总数,以及你想让别人刮的有多困难

您可以继续使用本例中的静态数据馈送(这意味着加载时将所有存储发送到浏览器),然后添加一些逻辑以仅显示最接近的10(例如将面板中未显示的所有标记的映射设置为null),但如果出现以下情况,则这不是一个好的解决方案:

  • 有很多商店(超过一千家左右),因为当只显示少数商店时,加载所有商店的速度会不必要地慢
  • 你不希望有人看到你的代码,然后抓取你发送的完整CSV和你所有的数据
考虑到您的抓取问题,更好的方法可能是使用动态数据源实现商店定位器,该动态数据源仅返回给定lat/lng的最近N个记录,这样您就不会一次公开整个内容。使用谷歌服务,您可以使用具有API的地图引擎,商店定位器包括谷歌地图引擎示例e您可以从开始。您在这里的安全问题是,如果这些查询是公开的,任何人都可以直接点击,那么该表也是公开的,然后有人可以查询完整的表。因此,您希望在两者之间放置一个代理,以避免这种类型的查询攻击(当然,如果有人真的愿意,他们可以提供给你很多地方,最终得到你所有的商店)

其他选项(同样只看Google的堆栈,尽管有很多类似的选项,比如CartoDB和更多)包括AppEngine的搜索API,它也返回N个最近的项目(但需要一些服务器端编码,而Maps引擎不会),甚至将数据放入Google电子表格,实现一个基本脚本->Web服务,在这里,您的脚本获取lat/lng并进行一些基本的数学运算,以找到最接近的


同样,如果您不喜欢服务器端方面,那么地图引擎可能是您快速入门的最佳选择,特别是考虑到storelocator代码中有一个工作示例。

code?指向您所指库的链接?示例?@geocodezip很抱歉,我添加了一些代码链接和更多细节。谢谢,但我想限制实际地图上的标记数,而不是左侧面板中列出的条目数。再次感谢您的帮助,但这最初最多只加载10个标记。我需要能够显示最多10个最接近输入地址的标记。我已更新了我的问题以使其更清楚。谢谢。我不需要用刮擦来防弹。我们有大约300个标记。你的第一个解决方案听起来很有效。你能给我一个代码示例吗?我基本上对javascript一窍不通。很抱歉,我非常感谢你的帮助。
m=e.min(10,c[E]);
for (var i = 1, row; row = rows[i]; i++) 
for (var i = 1, row; row = rows[i],i<XXX; i++)