Python小程序——利用wordcloud库生成词云(二)
wordcloud库利用wordcloud对象生成词云,其中可以配置很多属性,让你的词云更加个性化。
w_cloud = wordcloud.WordCloud(
font_path=font,
background_color=None, mode="RGBA", # 背景透明
width=1000,
height=600,
mask=mask)
# 参数含义如下:
# font_path : string //字体路径,需要展现什么字体就把该字体路径+后缀名写上,如:font_path = '黑体.ttf'
# width : int (default=400) //输出的画布宽度,默认为400像素
# height : int (default=200) //输出的画布高度,默认为200像素
# prefer_horizontal : float (default=0.90) //词语水平方向排版出现的频率,
# 默认 0.9 (所以词语垂直方向排版出现频率为 0.1 )
# mask : nd-array or None (default=None) //如果参数为空,则使用二维遮罩绘制词云。如果 mask 非空,
# 设置的宽高值将被忽略,遮罩形状被 mask 取代。除全白(#FFFFFF)的部分将不会绘制,其余部分会用于绘制词云。
# 如:bg_pic = imread('读取一张图片.png'),背景图片的画布一定要设置为白色(#FFFFFF),
# 然后显示的形状为不是白色的其他颜色。可以用ps工具将自己要显示的形状复制到一个纯白色的画布上再保存,就ok了。
# scale : float (default=1) //按照比例进行放大画布,如设置为1.5,则长和宽都是原来画布的1.5倍。
# min_font_size : int (default=4) //显示的最小的字体大小
# font_step : int (default=1) //字体步长,如果步长大于1,会加快运算但是可能导致结果出现较大的误差。
# max_words : number (default=200) //要显示的词的最大个数
# stopwords : set of strings or None //设置需要屏蔽的词,如果为空,则使用内置的STOPWORDS
# background_color : color value (default=”black”) //背景颜色,如background_color='white',背景颜色为白色。
# max_font_size : int or None (default=None) //显示的最大的字体大小
# mode : string (default=”RGB”) //当参数为“RGBA”并且background_color不为空时,背景为透明。
# relative_scaling : float (default=.5) //词频和字体大小的关联性
# color_func : callable, default=None //生成新颜色的函数,如果为空,则使用 self.color_func
# regexp : string or None (optional) //使用正则表达式分隔输入的文本
# collocations : bool, default=True //是否包括两个词的搭配
# colormap : string or matplotlib colormap, default=”viridis”
# 给每个单词随机分配颜色,若指定color_func,则忽略该方法。
默认生成的词云是一个长方形,黑色背景的图片,要想生成指定形状的词云图片就要用到mask属性了(这里用imageio库的imread()方法读取图片信息):
mask = imread('template.jpg')
我选的模板形状图(背景一定要全白#FFFFFF):
如果生成词云的字体颜色想从模板图片取色的话,用recolor()方法设置即可。
# 从背景图片生成颜色值
image_colors = wordcloud.ImageColorGenerator(mask)
w_cloud.recolor(color_func=image_colors)
关于Python的wordcloud库先写到这里,接下来利用词云图片实现一个很早以前写过的前端效果,文字聚合、散出动画:
直接贴源码吧,基于CSS3写的小特效。(说说大概思路:将图片设置为背景,然后用js将背景div划分成一个固定行数和列数的小div,每个小div使用CSS3的3D转换translate3d(x,y,z)函数和transform属性实现动画效果。)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>文字聚合、散出动画</title>
<style type="text/css">
html {
height: 100%;
padding: 0;
margin: 0;
}
body {
position: relative;
overflow: hidden;
width: 100%;
height: 100%;
background: #ccccff;
background-size: 100% 100%;
padding: 0;
margin: 0;
}
button {
position: relative;
z-index: 1;
}
#ctn {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
width: 1000px;
height: 563px;
-webkit-transform-style: preserve-3d;
}
#ctn div {
position: absolute;
background: url(wordcloud.png) no-repeat;
background-size: 1000px auto;
transition: all 0.6s ease;
-webkit-transition: all 0.6s ease;
-webkit-transform: translate(0, 0) translateZ(0) scale(1, 1) rotateX(0deg) rotateY(0deg);
}
</style>
</head>
<body>
<button id="btn_Spread">文字打散</button>
<button id="btn_Aggregate">文字聚合</button>
<div id="ctn"></div>
<script>
window.onload = function() {
function rnd(n, m) {
return parseInt(Math.random() * (m - n) + n);
}
var oDiv = document.getElementById('ctn');
var C = 6; //划分的列数
var R = 9; //划分的行数
//容器的中心点X坐标(相对于容器的左上角)
var divCX = oDiv.offsetWidth / 2;
//容器的中心点Y坐标(相对于容器的左上角)
var divCY = oDiv.offsetHeight / 2;
//接下来在容器内生成C * R 个 div
for (var i = 0; i < R; i++) {
for (var j = 0; j < C; j++) {
var oNewDiv = document.createElement('div');
//接下来给 oNewDiv 设置初始状态
var w = Math.floor(oDiv.offsetWidth / C); //小块的宽度
var h = Math.floor(oDiv.offsetHeight / R); //小块的高度
var offsetLeft = j * w; //新元素的left值
var offsetTop = i * h; //新元素的top值
var l = offsetLeft + w / 2; // 新元素的中心点x坐标(相对于容器的左上角)
var t = offsetTop + h / 2; // 新元素的中心点y坐标(相对于容器的左上角)
//容器中心点到新元素中心点向量(简化形式)
var disX = l - divCX; //初始的translateX值
var disY = t - divCY; //初始的translateY值
oNewDiv.setAttribute('class', 'oNewDiv');
oNewDiv.style.left = offsetLeft + "px"; //新元素的left值
oNewDiv.style.top = offsetTop + "px"; //新元素的top值
oNewDiv.style.backgroundPosition = "-" + offsetLeft + "px -" + offsetTop + "px"; //背景位置
oNewDiv.style.width = w + 'px';
oNewDiv.style.height = h + 'px';
oNewDiv.style.WebkitTransform = "perspective(800px) translate3d(" + disX + "px, " + disY + "px, 600px) rotateY(" + rnd(-180, 180) + "deg) rotateX(" + rnd(-180, 180) + "deg) scale(2,2)"; //初始的transform值
oNewDiv.style.opacity = 0; //初始的透明度为0
oDiv.appendChild(oNewDiv);
}
}
function animateSpread() {
for (var i = 0; i < document.getElementsByClassName('oNewDiv').length; i++) {
var oNewDiv = document.getElementsByClassName('oNewDiv')[i];
var l = oNewDiv.offsetLeft + oNewDiv.offsetWidth / 2;
var t = oNewDiv.offsetTop + oNewDiv.offsetHeight / 2;
var disX = l - divCX;
var disY = t - divCY;
oNewDiv.style.WebkitTransform = 'perspective(800px) translate3d(' + disX + 'px, ' + disY + 'px, 600px) rotateY(' + rnd(-180, 180) + 'deg) rotateX(' + rnd(-180, 180) + 'deg) scale(2,2)';
oNewDiv.style.opacity = 0;
}
}
function animateAggregate() {
for (var i = 0; i < document.getElementsByClassName('oNewDiv').length; i++) {
document.getElementsByClassName('oNewDiv')[i].style.WebkitTransform = 'translate3d(0,0,0)';
document.getElementsByClassName('oNewDiv')[i].style.opacity = 1;
};
}
//接下来让新元素飞到聚合状态,酱紫就会出现一张完整的“拼图”~
setTimeout(function() {
animateAggregate();
}, rnd(300, 500));
document.getElementById('btn_Spread').onclick = animateSpread;
document.getElementById('btn_Aggregate').onclick = animateAggregate;
}
</script>
</body>
</html>