簡體   English   中英

d3 wordcloud 字體大小不適應

[英]d3 wordcloud fontsize doesn't adapt

我的 d3.wordcloud 文檔的字體大小不受 wordlist.tsv 文件中指定的計數的影響。 但是,從我對代碼的理解來看,它應該是。

<!DOCTYPE html>
<html>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="build/d3.layout.cloud.js"></script>
<head>
    <title>Word Cloud Example</title>
</head>

<body>
</body>

<script>
 var width = 500; heigth = 500;



var wordscale = d3.scale.linear().range([10,60]);
 var fill = d3.scale.category20();
        d3.tsv("wordlist.tsv",function(data){
        var wordlist2 = data
                .filter(function(d){ return +d.count > 10;})
                .map(function(d){ return{text: d.word +" ("+ d.count+")", fsize: +d.count};})
                .sort(function(a,b){return d3.descending(a.fsize,b.fsize);})
                .slice(0,100);



        wordscale.domain([0,d3.max(wordlist2, function(d) {return d.fsize;})]);
            d3.layout.cloud()
                .size([width, heigth]) 
                .padding(1)
                .words(wordlist2) 
                .rotate(0)
                .fontSize(function(d) { return wordscale(+d.fsize); })
                .on("end", draw) //afblijven
                .start(); //start algoritme
});


function draw(words) {
   d3.select("body")
          .append("svg")
                .attr("width", width)
                .attr("height", heigth)
                .attr("class", "wordcloud")
              .append("g")
                .attr("transform", "translate("+width/2+","+heigth/2+")")
                .selectAll("text")
                .data(words)
              .enter().append("text")
                .style("font-size", function(d) { d.fsize + "px"; })
                .style("fill", function(d, i) { return fill(i); })
                .attr("transform", function(d) {return "translate(" + [d.x, d.y] + ")rotate(" + d.rotate + ")";})
                .text(function(d) { return d.text; });
    }

</script>
</html>

從我理解的以下代碼行:

.fontSize(function(d) { return wordscale(+d.fsize); })

應該使代碼適應代碼中前面定義的比例,但遺憾的是它沒有並且所有單詞的大小都相同。 盡管 .tsv 文件中每個單詞的計數參數不同

有什么建議嗎?

解決了,我忘記了以下代碼行中的 return 語句

.style("font-size", function(d) { d.fsize + "px"; })

這應該是:

.style("font-size", function(d) {return d.fsize + "px"; })

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM