3D标签云flash插件相关资料

shirlly

浏览: 1651818 次
性别:
来自: 福州

最近访客更多访客>>

cyzy168

acxingyun

123456lllppp

梁静茹的小三

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

flash插件

flash

引用

WP上面有个标签云插件相当酷（似乎叫做“wp-cumulus”），之前有网友在问本站首页的那个标签云的实现，这里说来惭愧，这个东西是无意间在网上捡到的，至今我也忘记是在哪里看到的，估计是在网上瞎逛的时候抠下来的- -！其实就是一个flash，然后把它签到网页上面去而已，并不是什么控件啥的。这个东西使用起来比较简单但就是没有api文档啥的...这里把我的使用情况和大家分享一下！
    如果懂as的话可以试着反编译出来，本人之前反过一次，不过由于在as方面的知识为零，所以没咋看懂，OTZ......

    标签云效果可以看下本站首页（右边偏下方）标签云Html代码：
    <embed src="TagsClound.swf"
        wmode="transparent"
        allowscriptaccess="always"
        quality="low"
        flashvars='[jsonData]'
        pluginspage="http://www.macromedia.com/go/getflashplayer"
        type="application/x-shockwave-flash"
        width="250"
        height="250">
    </embed>
    这里关注两个参数，一个是src，就是swf文件的地址，请点击下载：TagsClound.swf，
    另外一个是flashvars，这个参数的值是一个json字符串，下面是对这个参数的内容介绍。
    标签云flashvars属性（jsonData）    jsonData={
        "type":"tagBall",
        "color":"0x222222",
        "delicacy":2,
        "renderCycleTime":10,
        "radius":100,
        "focalLength":999,
        "rotationModeX":0,
        "rotationModeY":0,
        "elements": [
            {"type":"text","size":12,"bold":0,"data":"jquery","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=jquery","window":""},
            {"type":"text","size":12,"bold":0,"data":"插件","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=插件","window":""},
            {"type":"text","size":12,"bold":0,"data":"程序员","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=程序员","window":""},
            {"type":"text","size":12,"bold":0,"data":"jquery UI","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=jquery UI","window":""},
            {"type":"text","size":12,"bold":0,"data":"电影","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=电影","window":""},
            {"type":"text","size":12,"bold":0,"data":"Facebook","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=Facebook","window":""},
            {"type":"text","size":12,"bold":0,"data":"文本编辑器","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=文本编辑器","window":""},
            {"type":"text","size":12,"bold":0,"data":"IE6","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=IE6","window":""},
            {"type":"text","size":12,"bold":0,"data":"ASP.NET","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=ASP.NET","window":""},
            {"type":"text","size":12,"bold":0,"data":"MVC3.0","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=MVC3.0","window":""},
            {"type":"text","size":12,"bold":0,"data":"验证码","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=验证码","window":""},
            {"type":"text","size":12,"bold":0,"data":"Javascript库","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=Javascript库","window":""},
            {"type":"text","size":12,"bold":0,"data":"UI","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=UI","window":""},
            {"type":"text","size":12,"bold":0,"data":"RIA","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=RIA","window":""},
            {"type":"text","size":12,"bold":0,"data":"IT","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=IT","window":""},
            {"type":"text","size":12,"bold":0,"data":"Visual Studio","hcolor":"0xff4400","herf":"http://www.youguanbumen.net/Articles.aspx?tag=Visual Studio","window":""}
            ]
        }
        以上这些内容作为embed标签的flashvars属性的值，这里为了好看分成好几行，实际使用的时候不应该分行！另外一个需要注意的是，这个插件使用的是GB2312中文编码！！！
    标签云jsonData说明        声明：由于这个flash插件是在网上捡到的，所以没有任何API啥的，所以对于这些参数的作用只能是按照我的理解来写 - -！
        "type":            目前只发现这个参数值，"tagBall"
        "color":           字体颜色，十六进制数（鼠标没有悬浮上去时候的颜色）
        "delicacy":        旋转速度，越大越快
        "renderCycleTime": 渲染频率，设置太大的话看起来会卡
        "radius":          球体半径
        "focalLength":     焦距，主要是影响到离心力，反比
        "rotationModeX":   x轴旋转模式，数字，可负
        "rotationModeY":   y轴旋转模式，数字，可负
        "elements":        json格式的参数的数组，用于设置每一个“云”
                {
                "type":   目前只发现这个参数值，"text"
                "size":   字体大小
                "bold":   文本是否用粗体显示（1=是；0=否）
                "data":   显示的文本
                "hcolor": 鼠标悬浮时候的颜色，十六进制数
                "herf":   点击后跳转的地址
                "window": 相当于html中a标签的target属性
                }
转自：http://www.youguanbumen.net/89.html

引用

昨天超站的版主小光头看到一个网站上有一个TAGS云的特效，很漂亮也很有个性。我上去看了一下，原来是3D标签云。说实话确实很漂亮，这个3D标签云实现起来后可以将所有的标签都集中在一个FLASH里，并且所有的标签组成的标签云还会在这个3D标签云内形成一个球形不断的滚动；当你的鼠标移动到这个3D标签云内的任何一个标签时，所有标签会加速滚动，并且所你选择的那个标签会自动滚到最前。如图：

     我一看到这个3D标签云的特效的时候，我也一下子喜欢上了，而且很巧合，之前我也在另一个网站上看到同样的效果。于是我就答应小光头帮他把代码拿出来，费了好长的时间我才弄清楚这个特效。下面是我实现之后的效果演示：http://www.yi7.org/demo/3d-tags-demo.htm

     这个3D标签云代码如下：

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="240" height="200" id="myFlashContent">
<param name="movie" value="3dtags.swf" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="wmode" value="transparent" />
<param name="allownetworking" value="all" />
<param name="flashvars" value='jsonData=
{"type":"tagBall","delicacy":2,"renderCycleTime":20,"radius":80,"focalLength":300,"color":"#000000","rotationModeX":14,"rotationModeY":14,"elements":
[{"type":"text","data":"2009","hcolor":"0xFF6600","size":16,"bold":1,"herf":"http://www.yi7.org/catalog.asp?tags=2009","window":"_blank","fontFamily":"\u5fae\u8f6f\u96c5\u9ed1"}]}' />
<a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash
player" /></a>

</object>

</object>

     上面的代码中，只给出了一个标签的链接，红色部分为一个完整的标签代码，多个标签用半角逗号隔开；上面的代码中蓝色部分为你的标签和链接的地址，除了这两个地方要改，其余的不需要改。如果要改变显示的大小，请直接修改代码第一行中的width="240" height="200"部分。

     这样3D标签云特效需要用到一个.swf的文件，下载这个文件请登陆http://bbs.supadmin.com/thread-26654-1-1.html。下载后上传到您的网站，同时请在上面代码第二行中的“<param name="movie" value="3dtags.swf" />”将该swf的文件路径修改正确，如果不会相对路径，可以使用绝对路径。

     因为我也是匆忙中找到的这个代码，虽然不是很完美，但是确实可以使用，而且如果您使用的CMS或你的网站程序支持循环标签调用的话，要实现起来还是比较简单的。如果对上面的代码看得不是很明白，请直接查看演示页面http://www.yi7.org/demo/3d-tags-demo.htm的源代码，仔细分析很容易找出规律。本来我也想做一个直接拿去就可以用的代码，但是每个人使用的网站程序不一样，标签的调用方法也不一样，而且我看了大部分网站的在3D标签云的效果都是使用的网站程序的插件，所以我无法提供直接拿去就能用的代码。

     当然，如果您发现有更完美的3D标签云的调用方式，请您分享给我。

     最后，关于这个3D标签云的使用，有几点需要注意：1）、链接中好像不能有中文字符，否则链接会出错；2）、支持最大的显示效果是240X200，超过这个范围标签的显示范围也就这样大，四周会出现很多空白，但是对于缩小没有限制，这应该是那个swf文件的原因；3）、这个3D标签云内不要放太多的标签，因为他的显示大小有限，多了会显得密密麻麻，反而不好看了；4）、要浏览到这个3D标签云的特效，需要你的浏览器支持flashplayer插件，我在本机测试IE内核的浏览器直接就可以浏览，但是火狐内核的浏览器需要下载安装flashplayer。
转自：http://www.yi7.org/post/3d-tags.html

分享到：