PHP 文字云,HTML5画布下js的文字云/标签云效果-D3 Cloud

如果你想创建漂亮的文字云或者标签云效果的话，你可以考虑使用D3-Cloud，这是一个超棒的开源字体云效果javascript类库，基于知名的D3.js，能够帮助你生成类似wordle.com风格的字体或者标签云效果。

这个类库使用HTML5画布来生成字体效果，整个布局算法可以异步实现，只需要设置时间块大小。并且支持动画特效。整体性能非常不错。

配置如下var fontSize = d3.scale.log().range([10, 100]);

var layout = cloud()

.size([960, 600])

.timeInterval(10)

.text(function(d) { return d.key; })

.font("Impact")

.fontSize(function(d) { return fontSize(+d.value); })

.rotate(function(d) { return ~~(Math.random() * 5) * 30 - 60; })

.padding(1)

.on("word", progress)

.on("end", draw)

.words([…])

.start();

复制代码

文字，字体和字体大小，旋转和边框距离都可以自定义。包含两个事件：word - 当每一个文字添加后触发

end - 当全部文字添加后触发