HTML5 知识库

使用HTML5+Canvas,实现 流光溢彩的TV 效果

   阅读:560次   评论:9条   更新时间:2011-09-15    

 

Sergey Chikuyonok 使用HTML5+Canvas,创建出了一个流光溢彩的 TV 效果。

 

重要实现代码如下:

 

 

function getMidColors(side) {
        var w = buffer.width,
                h = buffer.height,
                lamps = getOption('lamps'),
                block_width = getOption('block_size'),
                block_height = Math.ceil(h / lamps),
                pxl = block_width * block_height * 4,
                result = [],
 
                img_data = buffer_ctx.getImageData(side == 'right' ? w - block_width : 0, 0, block_width, h),
                total_pixels = img_data.data.length;
 
 
        for (var i = 0; i <lamps; i++) {
                var from = i * w * block_width;
                result.push( calcMidColor(img_data.data, i * pxl, Math.min((i + 1) * pxl, total_pixels - 1)) );
        }
 
        return result;
}

 点击查看:http://chikuyonok.ru/ambilight/

 

 

评论 共 9 条 请登录后发表评论
9 楼 babashengri 2011-08-10 16:38
你这台高端了。 表示压力黑大。
8 楼 java032 2010-04-08 15:00
Firefox 可以
遨游 360  IE 都不行
7 楼 liweixw 2010-03-17 22:13
内存一直到300MB
6 楼 hepeng19861212 2010-03-17 12:40
浏览器:Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-CN; rv:1.9.1.8) Gecko/20100202 Firefox/3.5.8
CPU:AMD Athlon 64 processor 3000+
内存:1G

cpu 100%,播放好卡~~~~
5 楼 nail2008 2010-03-17 09:59
IE9才开始支持HTML5
4 楼 wkkyo 2010-03-17 09:09
IE看不了
3 楼 wiwiluo 2010-03-17 08:37
CherryRemind 写道
Chrome可以看, IE7貌似不支持~~~

IE还不支持HTML5
2 楼 yuriyan 2010-03-16 20:03
前几天就有的新闻了。。。
1 楼 CherryRemind 2010-03-16 17:27
Chrome可以看, IE7貌似不支持~~~

发表评论

您还没有登录,请您登录后再发表评论

Global site tag (gtag.js) - Google Analytics