Javascript D3：如何创建后跟标签文本的输入元素？

我有一个数组

var brands=['Option1'，'Option2']

。我想使用D3输出带标签的单选按钮，如下所示：

<label>
  <input type="radio" name="brand" value="Option1" checked="true"/> Option1
</label>
<label>
  <input type="radio" name="brand" value="Option2" /> Option2
</label>

它非常接近于工作，但它输出以下内容：

<label>
  Option1 <input type="radio" name="brand" value="Option1" checked="true" />
</label>
<label>
  Option2 <input type="radio" name="brand" value="Option2" />
</label>

选择1
选择2

无论我做什么，我都不知道如何将文本放在

元素之后。我应该做些什么不同的事情

---

如果我最后不必重新选择输入元素来添加侦听器，那也很好

尝试在脚本末尾添加以下内容：

d3.selectAll("label")
    .data(brands)
    .append("text")
    .text(function(d) { return d; });

并删除以下行：

.attr("for", function(d) { return d; })
.text(function(d) { return d; })

您不需要重新选择输入。在.append（“输入”）之后添加侦听器：

.append("input")
.on('change', function() {
  renderValues(this.value);
})

---

你看到了吗？谢谢，除非我遗漏了什么，否则教程中所有输入和标签元素的顺序都已经硬编码到HTML中了。我对生成动态列表很感兴趣。谢谢，这很有效。我不需要重新绑定数据，只需执行d3.selectAll（“label”）.append（“text”）.text（函数（d）{return d；}）。聪明地使用SVG文本元素。

.append("input")
.on('change', function() {
  renderValues(this.value);
})