如果位置的“id”有空間，角度數據圖不會填充正確的顏色

Question

對於角度數據圖，假設這是我的 mapObject，並且我的位置名稱帶有 id（“AZ”、“CO”、“AZ CO”、“CO AB”）（完全與空格一起）

$scope.mapObject = {
  scope: 'usa',
  options: {
    width: 1110,
    legendHeight: 60 // optionally set the padding for the legend
  },
  geographyConfig: {
    highlighBorderColor: '#EAA9A8',
    highlighBorderWidth: 2
  },
  fills: {
    'HIGH': '#CC4731',
    'MEDIUM': '#306596',
    'LOW': '#667FAF',
    'defaultFill': '#DDDDDD'
  },
  data: {
    "AZ": {
      "fillKey": "MEDIUM",
    },
    "CO": {
     "fillKey": "HIGH",
    },
    "AZ CO": {
      "fillKey": "LOW",
    },
    "CO AB": {
      "fillKey": "MEDIUM",
    }
  },
}

渲染 map 時，Colors 填充為：AZ 為中，CO 為高，“AZ CO”為高，“CO AB”為高。

如果“AZ”和“CO”值在數據內部的順序不同（首先是“CO”，然后是“AZ”），則 Colors 填充的 CO 為高，AZ 為中，“AZ CO”為中，“AZ CO”為中，“一氧化碳"

在沒有這些位置覆蓋它們的情況下，我該怎么做才能獲得相應的 colors？

TIA。

Answer 1

這是一個建議：

var locations = $scope.mapObject.data;
var colors = $scope.mapObject.fills;

var locationsColors = {};
var dataFormatted = [];
for (location in locations) {
  locationsColors[location] = colors[locations[location].fillKey];
}
console.log("Object of Locations Colors mapping : ", locationsColors);
console.log("Color of 'AZ CO' for example is : ", locationsColors["AZ CO"]);