将过滤条件应用于地图的最佳方式

我有一个页面，其中包含一张Google Maps V3地图和一个带有“过滤器”按钮的HTML表单。将过滤条件应用于地图的最佳方式

我也有这个大的XML文件，它具有复杂的结构，每个标记的信息都将被解析为每个标记的信息框中的html。

我能够从XML文件中读取和生成标记并将它们绘制在地图上，但是我无法将我的头围绕过滤地图上的标记。

什么是过滤地图上的标记，压紧以后“过滤器”按钮，最彻底的方法，能够满足与页面上的HTML表单指定我的筛选标准是什么？

我的窗体有一个列表框至今：

Company - 根据您选择它应该显示其所有分支机构在地图上什么公司名称。 XML文件包含所有这些信息（分支地址，lat，lng，phonenumber，comapny它所属的）。

XML结构：

<markers> 
    <marker> 
     <company name="ComapnyName"> 
      <branches> 
       <branch> 
        <address>BranchAddress</address> 
        <phone>BranchAddress</phone> 
        <products> 
         <product> 
          <name>ProductName</name> 
          <url>ProductURL</url> 
         </product> 
         <product /> 
         <product /> 
         ... 
        </products> 
       </branch> 
       <branch /> 
       <branch /> 
       ... 
      </branches> 
     </company> 
    </marker> 
    <marker /> 
    <marker /> 
    ... 
</markers>

来源

2012-05-08 Bob

为什么不设置一些数组并在每个数组中包含对标记的索引引用？如果您过滤公司名称，那么您应该能够引用数组中的公司名称及其各自的标记。但是，为什么不将XML文件中的数据移动到数据库并使用AJAX来即时请求标记？这看起来像一个更具可扩展性，高效和干净的方法。 – andresf

@andresf其实，我正在使用MySQL数据库。我有一堆有它们之间关系的表（外键，关联/联合表），它们保存着我在XML中的所有数据。我使用PHP通过调用数据库来生成我的XML文件。你是说使用AJAX查询数据库搜索结果会更好吗？难道你不会像那样使用数据库服务器，而是每隔一小时左右使用一个cron作业更新的大型XML文件。 – Bob

直截了当的方式来实现你的描述，是把你的标记到Array，遍历Array当过滤器设置更改，然后或者打开滤波标记关：

Marker.setMap(null);

或上：

Marker.setMap(map);

如果你是治疗过滤器两种状态之间切换，你可能会想箱子一些州瓦尔跟踪过滤器设置，让你也可以写类似这样的代码：

var filterOptionAbcIsOn = false; 
function toggleFilters() { 
    if (filterOptionAbcIsOn) { 
     // loop across the Array and turn the markers off 
     filterOptionAbcIsOn = false; 
    } 
    else { 
     // loop across the Array and turn the associated markers on 
     filterOptionAbcIsOn = true; 
    } 
}

来源

2012-05-08 16:25:19

我需要使用类似'documnet.getElementById（'IDOfTheControlOnTheForm'）'的东西来获取在列表框或者其他类型的控件中选择了什么值，以便将它传递给JavaScript /使用它吗？ – Bob

是的，您必须检索html元素状态（选中，选中等）才能知道已设置了哪些过滤器设置。但同样重要的是，您还需要一种方法来了解“元素”状态何时发生变化。我所做的是：为每个过滤器设置在页面上放置一个“复选框”，使用jQuery将每个“复选框”显示为“图像/按钮”，然后为每个过滤器定义一个“click”事件侦听器，以便我可以更新地图显示为用户打开或关闭过滤器设置。 –

将过滤条件应用于地图的最佳方式

回答

相关问题