d3js - 简单渲染不起作用

d3js - simple rendering not works

我正在尝试使用 d3js 创建一个简单的列表信息,但不起作用。有人知道我在这里做错了什么吗?

var obj = {
"status": ["GOOD SERVICE"],
"name": ["123"],
"url": [null],
"text": ["..."],
"plannedworkheadline": [null],
"Time": [" 7:35AM"],
"Date": ["12/15/2011"]
}

function draw(data) {
   "use strict";
   d3.select("body")
   .append("ul")
   .selectAll("li")
   .data(data)
   .enter()
   .append("li")
   .text(function (d) {
    return d.name + ": " + d.status;
   });
  };

d3.json(obj, draw);
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>

data 必须是数组。

var obj = [{
"status": ["GOOD SERVICE"],
"name": ["123"],
"url": [null],
"text": ["..."],
"plannedworkheadline": [null],
"Time": [" 7:35AM"],
"Date": ["12/15/2011"]
}]

function draw(data) {
   "use strict";
   d3.select("body")
   .append("ul")
   .selectAll("li")
   .data(data)
   .enter()
   .append("li")
   .text(function (d) {
    return d.name + ": " + d.status;
   });
  };

draw(obj);
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>