d3.js標記來自Json /數組的雲大小？

我修改這個代碼：https://github.com/jasondavies/d3-cloud d3.js標記來自Json /數組的雲大小？

<script> 
    d3.layout.cloud().size([300, 300]) 
     .words([ 
     "Hello", "world", "normally", "you", "want", "more", "words", 
     "than", "this"].map(function(d) { 
     return {text: d, size: 10 + Math.random() * 90}; 
     })) 
     .rotate(function() { return ~~(Math.random() * 2) * 90; }) 
     .fontSize(function(d) { return d.size; }) 
     .on("end", draw) 
     .start(); 

    function draw(words) { 
    d3.select("body").append("svg") 
     .attr("width", 300) 
     .attr("height", 300) 
     .append("g") 
     .attr("transform", "translate(150,150)") 
     .selectAll("text") 
     .data(words) 
     .enter().append("text") 
     .style("font-size", function(d) { return d.size + "px"; }) 
     .attr("text-anchor", "middle") 
     .attr("transform", function(d) { 
      return "translate(" + [d.x, d.y] + ")rotate(" + d.rotate + ")"; 
     }) 
     .text(function(d) { return d.text; }); 
    } 
</script>

我想獲得從不同的JSON數據字和尺寸數據。我有兩個變量

jWord = ["abc","def","ghi,"jkl"]; 
jCount = ["2", "5", "3", "8"];

jWord有，我想在標籤雲來顯示的話。 jCount是相應單詞的大小（相同順序）。

我切換到這個詞來jWord，但不知道如何將尺寸部分開關在

 .words(jWord.map(function(d) { 
     return {text: d, size: 10 + Math.random() * 90}; 
     }))

我也有另外一個JSON格式的變量。

jWord_Count = ["abc":2, "def":5, "ghi":3, "jkl":8 ];

如果這種格式有幫助。

來源

2012-05-21 clerksx

嘗試d3.zip：d3.zip(jWord, jCount)返回合併的陣列，其中所述第一元件是所述第一字[jWord[0], jCount[0]]的文本和大小，所述第二元件是所述第二字，等等。例如：

.words(d3.zip(jWord, jCount).map(function(d) { 
    return {text: d[0], size: d[1]}; 
}))

實際上，d3.zip將面向列的數據轉換爲面向行的數據。您也可以僅以行爲形式表示您的數據以開始：

var words = [ 
    {text: "abc", size: 2}, 
    {text: "def", size: 5}, 
    {text: "ghi", size: 3}, 
    {text: "jkl", size: 8} 
];

最後，小心類型。你的計數表示爲字符串（"2"）而不是數字（2）。所以你可能想用+將它們強制轉換爲數字。

來源

2012-05-21 21:15:16 mbostock

太棒了，它的工作。非常感謝。 – clerksx

如果要聲明一個JSON var，即'var topicsJson = [{'abc'：2}，{'def'：5}，{'ghi'：3}，{'jkl'：8}]; 「如何在退貨聲明中處理？ – sAguinaga

d3.js標記來自Json /數組的雲大小？

回答

相關問題