词云生成器答案

【问题标题】：Word Cloud Generator词云生成器
【发布时间】：2026-02-11 01:05:01
【问题描述】：

我正在使用Jason Davies's Word Cloud Generator 创建词云生成器，但这只是一种输入数据的方法，它也 textarea 只接受 String 和我的问题，我的数据输入是对象：

var data= [{
            "text": "First",
            "size": 12
            }, {
            "text": "Second",
            "size": 35
          }];

现在，这个问题有解决方案吗？

【问题讨论】：

标签： d3.js word-cloud

【解决方案1】：

documentation 非常清楚应该如何使用它。以下内容来自example。

var layout = cloud().words(data);
layout.start();

function draw(words) {
  d3.select("#container").append("svg")
      .attr("width", layout.size()[0])
      .attr("height", layout.size()[1])
    .append("g")
      .attr("transform", "translate(" + layout.size()[0] / 2 + "," + layout.size()[1] / 2 + ")")
    .selectAll("text")
      .data(data)
    .enter().append("text")
      .style("font-size", function(d) { return d.size + "px"; })
      .style("font-family", "Impact")
      .style("fill", function(d, i) { return fill(i); })
      .attr("text-anchor", "middle")
      .attr("transform", function(d) {
        return "translate(" + [d.x, d.y] + ")rotate(" + d.rotate + ")";
      })
      .text(function(d) { return d.text; });
}

【讨论】：

【解决方案2】：

我的问题已通过使用 cloud.js 中的 Generate 函数和 Tags 数组解决。

【讨论】：