超酷的javascript文字云/标签云效果 – D3 Cloud

在线演示

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

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

文字，字体和字体大小，旋转和边框距离都可以自定义。包含两个事件：

  • word – 当每一个文字添加后触发
  • end – 当全部文字添加后触发

当然，支持web字体，你可以使用@font-face来设置字体风格。如果你能够应用到自己的网站中，肯定能够给你的网站增色不少！

来源：超酷的javascript文字云/标签云效果 – D3 Cloud

时间： 2024-10-23 02:24:09

超酷的javascript文字云/标签云效果 – D3 Cloud的相关文章

教你用javascript实现随机标签云效果_附代码_javascript技巧

标签云是一套相关的标签以及与此相应的权重.典型的标签云有30至150个标签.权重影响使用的字体大小或其他视觉效果.同时,直方图或饼图表是最常用的代表约12种不同的权数.因此,标签云彩能代表更多的权,尽管不那么准确.此外,标签云通常是可以交互的:标签是典型的超链接,让用户可以仔细了解他们的内容.   大概可以理解为一堆相关或者不相关的标签混到一块,根据不同的重要程度,或者其他维度的不同来为每个标签设置不同的样式已凸显他们的不同,这样的一堆标签在一起就是我们通常说的标签云了.   下面我们大概说一下

PS教程:制作超酷的3D文字效果

Photoshop教程:制作超酷的3D文字效果,学好本教程以后大家可以尝试着做中文字哦-很炫的效果哟- 学好本教程以后大家可以尝试着做中文字哦-很炫的效果哟- 步骤1 首先,我们需要写3D文本.我们可以在illustrator中制作,或者点击下面的缩略图下载样本(如何制作3D效果文字在这里就不累述了): 步骤2 放置3D文字,并重命名为"3D text ".然后,用魔术棒工具选择字母的表面,剪切出这部分,你会看到下面的效果. 步骤3 现在到了有趣的部分了.把这层复制两份,一份用于备份(

PS利用蒙版制作超酷的人像剪影文字(图文)

  PS利用蒙版制作超酷的人像剪影文字(图文)           最终效果 具体的制作步骤如下: 1.首先打开木纹图片 2.搜街舞素材,导入文档中 3.输入白色文字,改变大小尺寸位置,尽量布满街舞轮廓,然后把这些文字群组 4.没填满的部位用白色方块排列填充,也群组,之后合并组1和组2 5.调出街舞帅哥选区,添加蒙版 6.添加图层样式,效果如下

Illustrator设计超酷立体线条文字效果制作教程

给各位Illustrator软件的使用者们来详细的解析分享一下设计超酷立体线条文字效果的制作教程. 教程分享:           好了,以上的信息就是小编给各位Illustrator的这一款软件的使用者们带来的详细的设计超酷立体线条文字效果的制作教程解析分享的全部内容了,各位看到这里的使用者们小编相信大家是很清楚了制作方法了吧,那么各位就快去按照小编上面的教程自己去试着制作吧.

jQuery实现的超酷苹果风格图标滑出菜单效果代码_jquery

本文实例讲述了jQuery实现的超酷苹果风格图标滑出菜单效果代码.分享给大家供大家参考.具体如下: 这是一款超酷苹果风格图标滑出菜单,调用了jquery1.3.2的库文件,整个菜单动感十足,用在网站上增色不少. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-apple-style-ico-show-menu-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0

javascript实现动态标签云_javascript技巧

今天上学校的图书馆,看到了一个好玩的东西,特意百度了下,发现叫做"标签球",效果图为: 直接代码如下: CSS: #div1 {position:relative; width:350px; height:350px; border:1px solid #000; margin: 20px auto 0; } #div1 a {position:absolute; top:0px; left:0px; font-family: Microsoft YaHei; color:#000;

Photoshop制作超酷黑白像素文字效果

先来看看最终的效果图吧: photoshop教程具体的制作步骤如下: 新建一个文字图层,并写上你需要的文本. 栅格化文字,使用滤镜->像素化->马赛克 新建一个8×8像素的画布 分类: PS文字教程

PS打造超酷钢铁侠浮雕文字特效

看看效果图: 具体的制作步骤如下: 步骤1: 用PS创建新文件,背景设置为黑色.我们需要一些色彩进行对照.从这里下载"Stark"字体:http://www.dafont.com/stark.font 步骤2: 选择字体工具,随便写点什么,这里大小选择为:大字350像素,小字223像素.字体色彩设置为b10a01 步骤3: 切换到大字所在的图层,将大字的图层复制两次,然后选择原始图层,设置"渐变叠加",混合模式为"明度",在最下面,具体参数如图.

Photoshop制作超酷的番茄酱文字效果

  在本教程中,我们将使用AdobePhotoshop和Illustrator的结合,创造出逼真的番茄酱文字效果.我们还将展示如何在在最后一个可选步骤涂抹或涂抹番茄酱的效果.让我们开始吧! 1,准备文本 第1步 首先,我们将需要的文字.如果你擅长手工刻字,你可以简单地画出你想要的文字.如果没有,打开Illustrator中,创建一个新文件,使用添加文本文字工具(T) . 第2步 使用钢笔工具(P),手动绘制根据实际的字体类型的文本.这不会是那样干净真钞.但这不要紧,因为我们希望它尽可能逼真. 第