传单标记过滤

Question

我有传单地图，显示 30-50 个不同的标记。在地图下方，我有一个简单的 HTML 表单，用于过滤。用户将选择过滤器（例如：“城市”和“id”）。然后地图应该只显示满足这两个过滤器的标记。所有其他标记都应删除。我想这样做的逻辑是这样的：设置过滤器后，搜索标记的 json 源并删除所有未请求的。但我不知道如何实施。另外，如何在过滤器关闭后恢复所有默认标记？此外，过滤器还应作为单独的 HTML 表单位于传单地图之外。这就是我初始化标记的方式var city = [   {name: "City1", loc: [11.111, 22.222], id: "1"},   {name: "City2", loc: [12.111, 23.222], id: "2"},    {name: "City3", loc: [13.111, 24.222], id: "3"},    {name: "City3", loc: [14.111, 25.222], id: "4"} ];我没有包含其余代码，因为它是标准传单代码，因此为了保持紧凑。

Answer 1

您应该使用Array.prototype.filterID方法使用and过滤初始城市数组name：

const cities = [

  {name: "City1", loc: [11.111, 22.222], id: "1"},  

  {name: "City2", loc: [12.111, 23.222], id: "2"}, 

  {name: "City3", loc: [13.111, 24.222], id: "3"}, 

  {name: "City3", loc: [14.111, 25.222], id: "4"}

];

let selectedCity = "City2";

let selectedId = "2";

let filteredList = cities.filter( city => {

  return city.name === selectedCity && city.id === selectedId

});

console.log( filteredList );