1

我正在尝试使用wordcloud2.js来生成一些词云。使用给出的示例可以正常工作：

var options = 
{
  list : [ 
  ["Pear", "9"],
  ["Grape", "3"],
  ["Pineapple", "8"], 
  ["Apple", "5"]
  ],
  gridSize: Math.round(16 * document.getElementById('canvas_cloud').offsetWidth / 1024),
  weightFactor: function (size) {
    return Math.pow(size, 1.9) * document.getElementById('canvas_cloud').offsetWidth / 1024;
  }
}

WordCloud(document.getElementById('canvas_cloud'), options);

但是，我正在努力使用具有以下结构的 JSON 文件中的数据填充“列表：”：

[
    {
        "wordCloud": "Manchester",
        "Freq": 2321
    },
    {
        "wordCloud": "Munich",
        "Freq": 566
    },
    {
        ...
    },
    {
        "wordCloud": "Madrid",
        "Freq": 6
    }
]

我知道这是因为我对将值推送到数组的知识有限。到目前为止，我的尝试是：

$.getJSON('json/wordCloudGWT-' + site + '.json', function (data) {



      var wordCloudGWT = [];                
        for (var i=0;i<100;i++) {
    wordCloudGWT.push([data[i].wordCloud, data[i].Freq]);
    };


      console.log(wordCloudGWT);

var options = 
{
  list : wordCloudGWT,
  gridSize: Math.round(16 * document.getElementById('canvas_cloud').offsetWidth / 1024),
  weightFactor: function (size) {
    return Math.pow(size, 1.9) * document.getElementById('canvas_cloud').offsetWidth / 1024;
  }
}

WordCloud(document.getElementById('canvas_cloud'), options);

console.log(wordCloudGWT); 显示一个包含 100 个（对象？）的数组，每个长度为 2，但 wordcloud 没有显示。我在浏览器的控制台中看到一个错误，我认为这是因为 wordcloud2.js 没有解释 list : wordCloudGWT 我（错误地）认为它应该是。

如果我以这种方式强行创建列表

  list : [ 
  [data[0].wordCloud, "9"],
  [data[1].wordCloud, "3"],
  [data[2].wordCloud, "8"], 
  [data[3].wordCloud, "5"]
  ],

单词显示正确，但这种方法有两个问题：

  • 不考虑词的实际频率（词的大小）
  • 肯定有更优雅的方式来生成列表，因为手动添加 100 行代码

对于第一点，我认为我可以通过手动编辑列表来解决这个问题：

  list : [ 
  [data[0].wordCloud, data[0].Freq],
  [data[1].wordCloud, data[1].Freq],
  [data[2].wordCloud, data[2].Freq], 
  [data[3].wordCloud, data[3].Freq]
  ],

但是，这样做会以我第一次尝试时出现的相同 JS 错误告终。

有什么提示可以帮助我绕过困难吗？

4

2 回答 2

0

您可以使用Array.map格式化数据：

var formattedList = responseData.map(function(item) {
    return [item.wordCloud, item.Freq]
});

演示：http: //jsfiddle.net/64v75enq/

于 2015-04-07T23:57:51.787 回答
0

似乎 wordcloud2.js 库希望频率值是一个字符串，而您的 json 数据并非如此。所以改进你自己的示例代码；推送值时，在 Freq 变量的末尾添加一个 toString() 。像这样：

list : [ 
    [data[0].wordCloud, data[0].Freq.toString()],
    [data[1].wordCloud, data[1].Freq.toString()],
    ...
]
于 2015-04-08T00:22:22.620 回答