AlloyImage-专业图像处理引擎

internet

dorsywang

使用原生支持接口扩展功能ctx

给小狗图像添加一些文字      comLayer.ctx(function(){        this.font="40px Microsoft Yahei";        // 创建渐变        var gradient = this.createLinearGradient(0, 0, comLayer.canvas.width, 0);        gradient.addColorStop("0", "magenta");        gradient.addColorStop("0.5", "blue");        gradient.addColorStop("1.0", "red");        // 用渐变填色        this.fillStyle = gradient;        this.fillText("小狗好可爱", 30, 320);                }).show();

demo

繁忙的act方法执行图像处理、操作

调整一下小狗的色相 饱和度layer1.act("setHSI", 30, 0, 0).show();

Demo Here

使用多线程useWorker

在代码里加入$AI.useWorker("alloyimage.js");代码即以多线程的形式运行

AlloyPhoto 基于AlloyImage的在线处理应用 分为简约版与专业版

Q&AThanks

<script type="text/javascript"></script>

&nbsp; &nbsp; var canvas = $AI(400, 400, "red");&nbsp;&nbsp;&nbsp;&nbsp;canvas.show();

Demos &nbsp; Here

&nbsp; &nbsp; var img = new Image();&nbsp; &nbsp; img.src = "img/dog.jpg";&nbsp; &nbsp; img.onload = function(){&nbsp; &nbsp; &nbsp; var layer = $AI(this);&nbsp; &nbsp; &nbsp; layer.show();&nbsp; &nbsp; };

SimpleEasyFastMuti-thread

&nbsp; &nbsp; &nbsp; var layer1 = $AI(dogEl);&nbsp; &nbsp; &nbsp; var layer2 = $AI(border1El);&nbsp; &nbsp; &nbsp; layer1.add(layer2, "变暗").show();

Demo Here

神奇的Add方法合并图层操作

为小狗图片加点修饰

Add将两个图层合并在一起,支持与ps对应的17种图层混合模式支持单、多通道混合支持透明度支持混合位置

小狗合成的图像进行特效处理//素描comLayer.ps("sketch").show();//

demo

使用组合效果 轻松处理图片 ps

dorsyClip 前端样式开发辅助工具 可以精确还原样式稿

About Me

2013年毕业加入腾讯AlloyTeam团队成员主要作品: AlloyImage, AlloyPhoto, dorsyClip

使用AlloyImage初始化Canvas

基于Html5的图像处理开源引擎

DorsyWang (王斌)From: AlloyTeam

AlloyImage

v1.1

给小狗做高斯模糊layer1.act("gaussBlur", 20).show();demo其他更多处理请参见文档

重播 分享 评论
×
×

iPresst

版本:1.0

Copyright © iPresst.com. All Rights Reserved.

创作者:TAT.Aishen, TAT.CG, TAT.DM, TAT.Jarvis, TAT.Kinvix, TAT.Weber, TAT.Yussica