Question

我想使用这个D3.js：https://gist.github.com/vgrocha/1580af34e56ee6224d33

目前它只能使用类似于＆＃34; flare-labeled.json＆＃34;的结构。（在回购中找到）。

但我想使用这样的结构：

[
    {
    "ID": "10414713",
    "Case Number": "HZ152928",
    "Date": "02/16/2016 11:02:00 PM",
    "Block": "130XX S ELLIS AVE",
    "IUCR": "041A",
    "Primary Type": "BATTERY",
    "Description": "AGGRAVATED: HANDGUN",
    "Location Description": "CHA PARKING LOT/GROUNDS",
    "Arrest": "false",
    "Domestic": "false",
    "Beat": "0533",
    "District": "005",
    "Ward": "9",
    "Community Area": "54",
    "FBI Code": "04B",
    "X Coordinate": "",
    "Y Coordinate": "",
    "Year": "2016",
    "Updated On": "02/19/2016 03:45:53 PM",
    "Latitude": "",
    "Longitude": "",
    "Location": ""
    },
    {
    "ID": "10414628",
    "Case Number": "HZ152506",
    "Date": "02/13/2016 11:45:00 PM",
    "Block": "017XX W DIVISION ST",
    "IUCR": "0890",
    "Primary Type": "THEFT",
    "Description": "FROM BUILDING",
    "Location Description": "TAVERN/LIQUOR STORE",
    "Arrest": "false",
    "Domestic": "false",
    "Beat": "1213",
    "District": "012",
    "Ward": "1",
    "Community Area": "24",
    "FBI Code": "06",
    "X Coordinate": "1164361",
    "Y Coordinate": "1908039",
    "Year": "2016",
    "Updated On": "02/20/2016 03:53:39 PM",
    "Latitude": "41.903278103",
    "Longitude": "-87.671706965",
    "Location": "(41.903278103, -87.671706965)"
    }
]

我想要＆＃34;主要类型＆＃34;在内环和＆＃34;描述＆＃34;在外圈和＆＃34;位置描述＆＃34;在外外圈上。

这可能吗？

Answer 1

我不会碰到d3插件。相反，我将数据转换为类似的。

假设您提供的数据位于名为data的变量中，您可以写：

var input = {
  "name": "flare",
  "description": "flare",
  "children": []
}

for (var i = 0; i < data.length; i++) {
  var incident = data[i];
  var primary = incident["Primary Type"];
  var description = incident["Description"];
  var locDesc = incident["Location Description"];
  var primaryIndex = -1;
  for (var j = 0; j < input.children.length; j++) {
    if (input.children[j].name == primary) {
      primaryIndex = j;
      break;
    }
  }
  if (primaryIndex == -1) {
    input.children.push({
      "name": primary,
      "description": primary,
      "children": []
    })
    primaryIndex = input.children.length - 1;
  }
  var node = input.children[primaryIndex];
  var descriptionIndex = -1;
  for (var j = 0; j < node.children.length; j++) {
    if (node.children[j].name == description) {
      descriptionIndex = j;
      break;
    }
  }
  if (descriptionIndex == -1) {
    node.children.push({
      "name": description,
      "description": description,
      "children": []
    })
    descriptionIndex = node.children.length - 1;
  }
  var node = node.children[descriptionIndex];
  var locDescIndex = -1;
  for (var j = 0; j < node.children.length; j++) {
    if (node.children[j].name == locDesc) {
      locDescIndex = j;
      break;
    }
  }
  if (locDescIndex == -1) {
    node.children.push({
      "name": locDesc,
      "description": locDesc,
      "size": 0
    })
    locDescIndex = node.children.length - 1;
  }
  node.children[locDescIndex].size++;
}

现在d3所需的输入位于input。

如何修改此D3.js以接受不同的JSON结构？

1 个答案: