javascript - d3jsは別のタグ内にタグを追加します

Question

次のようなHTMLで凡例を作成したいと思います。

<li><span style="background-color:#n;"></span> Label</li>

しかし、出力は次のとおりです。

<li>Label <span style="background-color:#n;"></span></li>

これは私のコードです：

d3.select("#myid").selectAll("li")
.data(dataset)
.enter().append("li")
.text(function(d) {return d;})
.insert("span")
.attr('style', function(d, i) {return "background-color:" + color});

いくつかの提案？ありがとう

Answer 1

テキストの前にスパンを挿入するだけです。

d3.select("#myid").selectAll("li")
.data(dataset)
.enter()
.append("li")
.text(function(d) {return d;})
.insert("span", ":first-child")
.attr('style', function(d, i) {return "background-color:" + color});

Answer 2

さて、最終的にはcssfloatの左端の@Asadコードで修正しました。