时间戳

首页 > 解决方案 > 如何编写用于输入多列、比较它们的值并在地图中触发过滤器的 mapbox 表达式？

javascript - 如何编写用于输入多列、比较它们的值并在地图中触发过滤器的 mapbox 表达式？

问题描述

我很高兴你正在阅读我的这篇文章并帮助我解决这个问题。感谢您为此付出的时间和努力。

这是我对单列值过滤的表达式。这对于一列（Project_Name）很好，但我需要输入多列：

var expression = [
                    "any",
                        ["in", ["get", "Project_Name"], ["literal", [selected.innerHTML]]
                      ]];

尝试的方法：

#1：

   var features = map.queryRenderedFeatures(e.point);
                      
   var long = String(features[0].properties.Longitude);
   var lat = String(features[0].properties.Latitude);  
                      
   var expression1 = [
                        "any",
                        ['in', long, ['get', 'Longitude']],
                        ['in', lat, ['get', 'Latitude']],
                        ["in", ["get", "Project_Name"], ["literal",[selected.innerHTML]]
                      ]];

#2：

 var expression2 = ['match', 
                      ['in', long, ['get', 'Longitude']],
                      ['in', lat, ['get', 'Latitude']]
                    ];

这不会导致任何错误，但不会提供所需的过滤结果。如果有人知道如何解决这个问题，那么您的帮助将非常有价值。

我相信以下图片将完美地说明我的意思：

在过滤地图之前：在此处输入图像描述

  1. 当我点击符号时，我想要的结果：在此处输入图像描述

  2. 我得到的结果：在此处输入图像描述

所以基本上我想要实现的是，我的所有符号都应该严格根据坐标而不是根据项目名称过滤掉。

如果这篇文章需要编辑更多信息，请不要犹豫。随意。谢谢。

标签： javascriptmapboxmapbox-gl-js

解决方案

您的方法是正确的：使用['any']运算符将​​多个表达式组合为 OR。

如果这不起作用，则您的问题出在各个表达式上。

对于初学者，您的第二个表达式试图匹配Longitudestring中字段的值90.18。这似乎不太可能是你想要的。也许您想与一个数字进行比较：['==', ['get', 'Longitude'], 90.18]

你也有不一致的情况：Longitude, latitude.

不过，目前还不清楚您要达到的目标。

推荐阅读