匹配geojson文件参数中的确切元素Openlayer 3

时间:2017-03-08 10:30:32

标签: for-loop openlayers-3

我有以下函数从select中获取一个选项,并通过我的geojson文件中的参数进行匹配。如果找到完全匹配,则应以特定样式显示图层。

Everythng似乎没问题,因为函数为每个特征找到了正确的对象,它实际上得到了名为&#34; Criteria&#34;并将其放入包含所有标准的数组中(例如array = {&#34; A&#34;,&#34; B&#34;,&#34; Bi&#34;,&#34; Bii&#34它还会检查所选选项是否与数组中的某个元素匹配。但它不会输出命令//when clicking the select document.getElementById("criteria_select").addEventListener('click', function (){ //first step it loads the vector layer and sets the style to transparent var i; for (i = 0; i < layers_group.length; ++i){ layers_group[i].setStyle(transparentStyle); layers_group[i].setVisible(true); }; //second step when the select changes (i.e. I make a choice) $("#criteria_select").change(function() { //it starts the function to change styles according to the selection made var selectedCriteria = $("#criteria_select").val(); console.log('selectedCriteria',selectedCriteria); var index; for (index = 0; index < source_group.length; index++){ source_group[index].forEachFeature(function(feat){ var array = feat.get('Criteria').split(','); for (i = 0; i < array.length; i++) { console.log(array[i]); if (selectedCriteria === array[i]){ feat.setStyle(selectStyle); } else { //and if doesnt exist switch back to the deafult style feat.setStyle(transparentStyle); } } }); }; }); });

有什么建议吗?可以找到一个完整的plunker here

{{1}}

1 个答案:

答案 0 :(得分:0)

你的plunkr代码充满了错误。

  1. search_criteria.js 脚本加载了错误的网址。
  2. 代码中的任何位置都没有定义 transparentStyle 对象。
  3. 定义的2个ol.style对象位于init()方法内,因此无法在外部使用。
  4. 两个ol.style个对象都相同。
  5. 创建ol.source.Vector时的url参数错误。因此,根本没有加载矢量图层。
  6. 我猜你的工作代码不会有上述错误。我已经冒昧地解决了上述问题并添加了 transparentStyle 对象。

    主要问题在于你的for循环。您不是要检查条件数组是否包含selectedCriteria,而是将每个条件值与selectedCriteria进行比较。如果条件被评估为真,则打破循环。

    修改1:

    if (selectedCriteria === array[i].trim()){
            feat.setStyle(selectStyle);
            break;
    } else {
        //and if doesnt exist switch back to the deafult style
        feat.setStyle(defaultStyle);
    }
    

    我已更新此plunkr中的代码link

    if (selectedCriteria === array[i])工作正常。但是你在数组[i]中传递的值包含错误的值。如果您看到 mediterranean.geojson 文件条件属性值类似于&#34; A,Bii,Ciii,Dii&#34; ,则两个逗号分隔值之间会有额外的空格。由于这个额外的空间,您可能会遇到这些问题。 修复: 在比较之前修剪字符串。我已经在Plunckr和答案中更新了代码。