试图显示 JSON 的多行中的相同数据

Question

我在尝试显示 header 时遇到问题，该 header 由使用 jQuery 和 JSON 的多个结果组成，使用开放层网络映射技术。正在使用 import.sql 和 PostgreSQL 导入数据。

原始数据：

2016-02-20,Mexico-Baja_加利福尼亚州,weekly_zika_confirmed,MX0001,NA,NA,0,cases,POINT(-113.41426 27.808935)

2016-02-20,Mexico-Baja_加利福尼亚州,yearly_cumulative_female,MX0002,NA,NA,0,cases,POINT(-113.41426 27.808935)

2016-02-20,Mexico-Baja_加利福尼亚州,yearly_cumulative_male,MX0003,NA,NA,0,cases,POINT(-113.41426 27.808935)

预期的显示应如下所示：

Mexico-Baja 加利福尼亚

weekly_zika_confirmed
zika_confirmed_male
zika_confirmed_female

而不是显示，目前看起来像：

Mexico-Baja 加利福尼亚

weekly_zika_confirmed

Mexico-Baja 加利福尼亚

zika_confirmed_male

等等。

代码片段，使用 .append 方法，我到目前为止：

map.on('click', function(event) {
    $('.sidepanel-reports').empty();
    map.forEachFeatureAtPixel(event.pixel, function(feature,layer) {
        console.log(feature); // ignore this part - for analysis purposes only

        $('.sidepanel-reports').append(`
            <h3>${feature.get('location')}</h3>
            <li>
                <p>${feature.get('dataField')} : ${feature.get('value')} ${feature.get('unit')}</p>
            </li>`
        );
    });
});

我知道这段代码看起来不对 - 我只是不能限制到一个数据（位置）。该行为应与 SQL 对 select 的 SELECTIVE DISTINCT 中发现的相同。使用 1 个数据，它包含属于 header 类别的所有结果。如果您知道更好的方法，将不胜感激。

Answer 1

forEachFeatureAtPixel 或 getFeaturesAtPixel 可能 return 以随机顺序排列的特征，如果您使用 getFeaturesAtPixel 并对数组进行排序，您应该能够构建分组输出。如有必要，排序和分组可以扩展到副标题。

var features = map.getFeaturesAtPixel(event.pixel);
features.sort(function(a, b){return a.get('location') < b.get('location') ? -1 : a.get('location') == b.get('location') ? 0 : 1)});
var location;
features.forEach( function(feature) {
    if (feature.get('location') !== location) {
        location = feature.get('location');
        $('.sidepanel-reports').append(`
            <h3>${feature.get('location')}</h3>
        );
    }
    $('.sidepanel-reports').append(`
        <li>
            <p>${feature.get('dataField')} : ${feature.get('value')} ${feature.get('unit')}</p>
        </li>`
    );
});

试图显示 JSON 的多行中的相同数据

Attempting to display the same data from JSON's multiple rows

jquery

openlayers