如何在数组中显示具有特定值的对象？

Question

我正在根据城市的对象值在地图上绘制城市。

我需要能够根据其值隐藏或显示这些图。

到目前为止，我具有以下功能，它将打开或关闭所有城市，以及一个在城市的值<= 30时记录城市的功能。

var mapData = {
    'cities': [{"name":"Москва", "latitude":55.752, "longitude":37.615, "value":"10", "color": am4core.color("#ff0000")},
    {"name":"Старая Ладога", "latitude":60.0016, "longitude":32.2926, "value":"20", "color":chart.colors.getIndex(1)},
    {"name":"Великий Новгород", "latitude":58.33, "longitude":31.16, "value":"30", "color":chart.colors.getIndex(1)},
    {"name":"Белозерск", "latitude":60.02, "longitude":37.46, "value":"40", "color":chart.colors.getIndex(2)},
    {"name":"Изборск", "latitude":57.7082, "longitude":27.8609, "value":"50", "color":chart.colors.getIndex(3)}
]};

var imageSeries = chart.series.push(new am4maps.MapImageSeries());
    imageSeries.data = mapData.cities;
    imageSeries.dataFields.value = "value";

var imageTemplate = imageSeries.mapImages.template;
    imageTemplate.propertyFields.latitude = "latitude";
    imageTemplate.propertyFields.longitude = "longitude";
    imageTemplate.nonScaling = true

var circle = imageTemplate.createChild(am4core.Circle);
    circle.fillOpacity = 0.7;
    circle.propertyFields.fill = "color";
    circle.tooltipText = "{name}: [bold]{value}[/]";

imageSeries.heatRules.push({
    "target": circle,
    "property": "radius",
    "min": 4,
    "max": 4,
    "dataField": "value"
})




function toggleCities() {
    var series = imageSeries;
        if (series.isHiding || series.isHidden) {
        series.show();
    }
    else {
        series.hide();
    }
}

我不确定是否需要更改以指定仅绘制值<= 30的城市。

Answer 1

此问题已在SO上得到解答，请访问2010年以来的这篇文章：How to filter object array based on attributes?

[另外，对于以后的帖子，请在您的问题中更通用。 SO的目的不是解决您的特定业务问题，而是回答常规的编程/语言问题。由于这些原因，我对您的帖子投了反对票。

Answer 2

Array.prototype.filter将是您追求的：

const filteredData = mapData.cities.filter(d => parseInt(d.value) <= 30);

[filter返回初始数组中的元素数组，这些元素的数组从传递给true的函数中返回filter()。

在您的示例中，我认为在function toggleCities()中您将想要：

imageSeries.data = filteredData;

[当您希望应用<= 30时，然后

imageSeries.data = mapData.cities;

当您不这样做时