Javascript d3单词云-出现过多重叠

我正在使用来自的d3示例来构建我自己的word cloud

我所要做的就是根据单词所表示的对象的属性，在单词中添加一些颜色属性

例如，有4个单词-美国、印度、英国和德国-我使用阈值设置单词的颜色-假设这更像是根据人口密度设置颜色

然而，这不会以任何方式影响字体的大小，字体可能表示国家的土地面积

我的问题是这些词彼此重叠

我想知道我可能做错了什么-看这段代码-我的'draw'函数。 我在这里做错了什么

    draw: function(countries) {
        var cctrplt = {BuOrPuRd: {
            4: ["#9ebcda","#e32636","#08306b", "#ffbf00"]
        }};
        var fillthr = 
            d3.scale.threshold()
            .domain([2, 5, 10])
            .range(cctrplt.BuOrPuRd[4]);
        d3.select("#ddTagCloudContentRoot").append("svg")
            .attr("width", width)
            .attr("height", height)
            .append("g")
            .attr("transform", "translate(300,300)")
            .selectAll("text")
            .data(countries)
            .enter().append("text")
            .style("font-size", function(d) { return (d.size) + "px"; })
            .style("font-family", "Impact")
            .style("fill", function(k,i) { var ccode = colours_list[k.text]; return fillthr(ccode); })
            .attr("text-anchor", "middle")
            .attr("transform", function(d) {
                return "translate(" + [d.x, d.y] + ")";
            })
            .text(function(d) { return d.text; });
    }

如果有任何其他代码我需要分享-让我知道

---

谢谢。

找到了解决方案。我没有使用rotate（）函数调用，因为我希望文本水平放置。我认为完全不打电话会有帮助

情况似乎并非如此。我加上旋转（0），就是这样。现在我得到了一个好看的单词cloud

---

小贴士：我使用笔划：黑色与文字样式相对应，这给了我一个整洁的演示。

哦，天哪，你刚才为我节省了这么多时间。拥有所有的ups。我使用了rotate（0），没有帮助。@dresh我认为rotate的参数必须是一个函数，比如

。rotate（function（）{return 0；}）