IDK 为什么我的 mapbox 地图不是交互式的。各县应该可以点击

Question

所以我很确定问题出在代码的以下部分中。更具体地说，地图点击功能。但我不知道为什么。它应该让我的地图上的每个县都能够被点击并将他们的数据显示在侧边栏上。但是我的 none 个县是可点击的。

map.on('load', function() {   // Map legend labelling and interaction with sidebar
  // legend labelling
  var layers = ['< 4.5%', '4.5% to 6%', '6% to 7.5%', '7.5% to 9%', '9% to 10.5%', '10.5% to 12%', '12% to 13.5%','13.5% to 15%','> 15%'];
  var colors = ['#fff2b8', '#FED976', '#FEB24C', '#FD8D3C', '#FC4E2A', '#E31A1C', '#BD0026', '#8E0101', '#49000E'];
  for (i = 0; i < layers.length; i++) {
    var layer = layers[i];
    var color = colors[i];
    var item = document.createElement('div');
    var key = document.createElement('span');
    key.className = 'legend-key';
    key.style.backgroundColor = color;
    var value = document.createElement('span');
    value.innerHTML = layer;
    item.appendChild(key);
    item.appendChild(value);
    legend.appendChild(item);
  }
  
  // This for the life of me just refues to run. Something with the layer name, id is making it not run the clicking functionality.
  map.on('click', function (e) {
    var features = map.queryRenderedFeatures(e.point, { layers: ["countyData"] });
    for (i in features) {
      if (features[i].layer.id == "countyData") {
         document.getElementById('tooltip').innerHTML = 
         ('<b>Selected County:</b>' + (features[i].properties.COUNTY_LAB).toFixed(0) + '<br/> ' + 
         '<br/>Total Population in 2014:  ' + (features[i].properties.totPop14).toFixed(0) + 
         '<br/>Percent of Population in Poverty 2014:  ' + (features[i].properties.povPercent14).toFixed(0) + '%' + 
         '<br/>Total Population in 2019:  ' + (features[i].properties.totalPop19).toFixed(0) + 
         '<br/>Percent of Population in Poverty 2019:  ' + (features[i].properties.povPercent19).toFixed(0) + '%' + 

         '<br/> ' + '</br><b>Change for each Race:</b>' + '<br/> ' + 

         '<br/>Change in total White population:  ' + (features[i].properties.whiteTotDelta).toFixed(1) + 
         '<br/>Change in White population in Poverty:  ' + (features[i].properties.whitePovDelta).toFixed(1) + '<br/> ' + 

         '<br/>Change in total Hispanic population:  ' + (features[i].properties.hispTotDelta).toFixed(1) + 
         '<br/>Change in Hispanic population in Poverty:  ' + (features[i].properties.hispPovDelta).toFixed(1) + '<br/>' +

         '<br/>Change in total Black population:  ' + (features[i].properties.blackTotDelta).toFixed(1)  + 
         '<br/>Change in Black population in Poverty:  ' + (features[i].properties.blackPovDelta).toFixed(1) + '<br/> ' + 

         '<br/>Change in total Asian population:  ' + (features[i].properties.asianTotDelta).toFixed(1)  + 
         '<br/>Change in Asian population in Poverty:  ' + features[i].properties.asianPovDetlta).toFixed(1) + '<br/> ' + 

         '<br/>Change in total Native American population:  ' + (features[i].properties.nativeTotDelta).toFixed(1) + 
         '<br/>Change in Native American population in Poverty:  ' + (features[i].properties.nativePovDelta).toFixed(1) + '<br/> ' +

         '<br/>Change in total Other population:  ' + (features[i].properties.otherTotDelta).toFixed(1)  + 
         '<br/>Change in Other population in Poverty:  ' + (features[i].properties.otherPovDelta ).toFixed(1);
        
         if (clickedStateId) {
           map.setFeatureState({sourceLayer: "County_Boundaries_of_NJ_EDITE-5q8kmm", id: clickedStateId, source:"composite"}, {"click":false})
        }
        clickedStateId = features[i][id];
        map.setFeatureState({sourceLayer: "County_Boundaries_of_NJ_EDITE-5q8kmm", id: clickedStateId, source:"composite"}, {"click":true})
        return;
      }
    }
 });
     map.getCanvas().style.cursor = 'default';
}

编辑： 访问令牌设置为只读，所以我不担心任何人都可以修改任何内容，而且我的地图样式无论如何都是私有的。如果我认为问题出在哪里是错误的，那么就不会有人指出来了。

Answer 1

修复者：

在 map.queryRenderedFeatures 行后添加 features=features[0]
摆脱了for i in features循环
将所有提及 features[i] 的内容更改为 features。

IDK 为什么我的 mapbox 地图不是交互式的。各县应该可以点击

IDK why my mapbox map isn't interactive. The counties should be able to clicked

html

mapbox