javascript - 如果位置的“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",
    }
  },
}

渲染地图时，填充颜色为：AZ 为中等，CO 为高，“AZ CO”为高，“CO AB”为高。

如果“AZ”和“CO”值在数据内部的顺序不同（首先是“CO”，然后是“AZ”），则填充的颜色为 CO 的高、AZ 的中、“AZ CO”的中、“一氧化碳"

在没有这些位置覆盖它们的情况下，我该怎么做才能获得相应的颜色？

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"]);