從JSON填充列表（不是HTML）

我試圖使用wordcloud2.js來生成一些詞雲。它使用給出的示例工作正常：從以下結構的JSON文件與數據：從JSON填充列表（不是HTML）

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);

然而，我與填充「清單」：奮力

[ 
    { 
     "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）;顯示一個長度爲2的100（對象？）數組，但wordcloud不顯示。我在瀏覽器的控制檯中看到一個錯誤，我認爲是因爲wordcloud2.js不是解釋列表：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錯誤結束。

任何暗示可以幫助我繞過我的困難？

來源

2015-04-07 agustin

您可以使用Array.map格式化數據：

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

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

來源

2015-04-07 23:57:51 tymeJV

Thx for Array.map。我不知道這件事。但是，我收到了同樣的錯誤。試着做和你的小提琴類似的事情，我用關鍵詞wordCloud＆Freq和他們各自的價值推送了我的JSON文件的前100個元素。在瀏覽器的控制檯中，我看到一個包含100個對象的數組。應用Array.map我將這個數組轉換爲另一個數組，但這次有100個不同的數組。但是，這個新數組與我在第一次嘗試中生成的數組看上去不一樣，正如問題中所述。難道我做錯了什麼？ – agustin

這似乎是wordcloud2.js庫的預期，頻率值是一個字符串，而不是這樣的你的json數據。因此改進您自己的示例代碼;在推送值時，在Freq變量的末尾添加toString（）。像這樣：

list : [ 
    [data[0].wordCloud, data[0].Freq.toString()], 
    [data[1].wordCloud, data[1].Freq.toString()], 
    ... 
]

來源

2015-04-08 00:22:22

最初我以爲是一樣的，但在問我用[data [0] .wordCloud，9]試過的問題之前，它也工作:) – agustin

從JSON填充列表（不是HTML）

回答

相關問題