使用d3.js上一个新的窗口(Use d3.js on a new window)

是否有可能打开新窗口时使用d3.js？例如，我想：

new_window = window.open("userpage.html");
new_window.document.write("<html><body>");
new_window.document.write("<table id=\"usertable\">");
new_window.document.write("</table>");
new_window.document.write("</body></html>");    
table = d3.select("#usertable");
console.log(table);
var thead = table.append("thead");
var tbody = table.append("tbody");
var columns = ["dataset"];

thead.append("tr")
    .selectAll("th")
    .data(columns)
    .enter()
    .append("th")
    .text(function(column) { console.log(column); return column; });

它不工作，和第一的console.log的输出中是

[
Array[1]
0: null
length: 1
parentNode: HTMLHtmlElement
__proto__: Array[0]
]

我觉得0: null并不好。

这里有几个问题：

我认为你是不正确打开新窗口-通常，你要么打开一个URL的内容，或者你使用""作为网址，并撰写内容为空白窗口。打开一个URL像"usertable.html" ，然后写<html><body>是没有意义的。最后，即使有一个空白的窗口，你不需要写<html><body> -浏览器一般会默认提供这些节点。
使用d3.select是去看看，在默认情况下，当前文件内。为了访问新打开的窗口的身体，你需要通过new_window.document -其实，你需要通过new_window.document.body ，因为你不能添加任何东西document没有HIERARCHY_REQUEST_ERROR 。
我也并不认为这是D3与混个好主意， document.write ，你在这里做。 D3在DOM节点选择，你现在有代码的方式，我不认为你的table实际上是直到你试图将其选中后合式节点。 D3是在插入新的DOM节点非常好 - 用它来代替。

把所有这些组合起来产生了这样的事情：

var newWindow = window.open('');

var newWindowRoot = d3.select(newWindow.document.body);

// now do some writing with D3
var data = [
    { foo: "Foo 1", bar: "Bar 1" },
    { foo: "Foo 2", bar: "Bar 2" }
];

var table = newWindowRoot.append('table');

var rows = table.selectAll('tr')
    .data(data);

rows.enter().append('tr');

var cells = rows.selectAll('td')
    .data(function(d) { return d3.entries(d); });

cells.enter().append('td');

cells.text(function(d) { return d.value; });

工作示例： http://jsfiddle.net/nrabinowitz/gQf7J/