您现在的位置: 爱51代码网 >> 范文 >> 文章正文
CANVAS有没有对颜色键的支持

【背景】
由于一些嵌入设备不支持透明色,我们在程序设计之初是通过颜色键表示透明色
我现在有一个背景图片(BG.bmp)和一个圆点(round.bmp),其中round.bmp的背景颜色为RGB(255,254,0)
在C#下我直接把要抠出的颜色在ColorKey中直接就能抠掉变成透明了

【现实】
但是现在因为某些标准(平台)要修改,有人提议顺便工作将要在HTML5平台上进行,然后提出将图形整合在CANVAS中(擦汗)。经过学习,我只了解到和“透明”有关的似乎只有globalAlpha,而通过它重绘后的缺陷却是会把整体图片变的偏红,不好分辨——尤其是当圆区的颜色为(255,255,0)的时候……

目前公司图库大概有100多万张,不可能为了新平台大搞第200万的图库吧?……所以希望各位前辈告知CANVAS是否有对颜色键的支持?如果有,烦请提供详细的介绍或有价值链接,如果没有我可以体现在可能性分析报告中。

好像没有颜色键
但canvas支持 像素级别的操作 你可以 读取像素的颜色 吧指定像素的颜色替换成你希望的透明色

吧一个canvas隐藏起来  绘制你的图片在分析像素  这个canvas可以作为你的填充素材

CANVAS好像没有对颜色键的支持

不过可以用getImageData() 方法返回画布的像素数据。
逐个像素判断,像素数据如果是指定颜色就将像素的alpha数据改为0

图片要onload之后才能用
var IMG2 = document.getElementById("PIC_LIB");
var PIC2 = IMG2.getContext("2d");
var BMP2 = new Image();
BMP2.src = ARROW_PIC_Name;
BMP2.onload = function ()
{
    PIC2.drawImage(BMP2,0,0);
 
    var imgData = PIC2.getImageData(0,0,IMG2.width,IMG2.height);
 
    for(var i = 0;i<imgData.data.length;i+=4){
      if(imgData.data[i] == 255 && imgData.data[i+1] ==0 && imgData.data[i+2]==255){
        imgData[i+3] = 0;
      }
    }
 
    PIC.putImageData(imgData,0,0);
}

  • 上一篇文章:

  • 下一篇文章: 没有了
  • 最新文章 热点文章 相关文章
    redhat 2.6 (santigo 5.6) vsftp
    shell如何实现自动填写操作执行下
    linux shell 文件配置sh:color:
    shell script语法一定要加path吗
    SecureCRT如何访问虚拟机vmWare中
    C#如何读取WINDOWS的放大系数
    cximge的图如何存入数据库并提取
    DBGRID控件显示查询结果文本类型
    TChart控件如何把表中右边的系列
    fastreport提示没有找到fr_class
    redhat 2.6 (santigo 5.6) vsftp
    shell如何实现自动填写操作执行下
    linux shell 文件配置sh:color:
    shell script语法一定要加path吗
    SecureCRT如何访问虚拟机vmWare中
    C#如何读取WINDOWS的放大系数
    cximge的图如何存入数据库并提取
    DBGRID控件显示查询结果文本类型
    TChart控件如何把表中右边的系列
    linux下编译faac及faad2提示 rec
    怎么样让ECharts从后台获取数
    AnyChat音视频引擎开发的软件
    Jquery/Javascript动态获取J
    js如何获取css设置的样式
    如何获取一个TABLE里所有的i
    jquery如何获取js输出的数据
    preventDefault()如何阻止被
    expression 在chrome下怎么用
    如何检测当前批处理是否以管
    网上邻居出现多个pptv多屏互
     



    设为首页 | 加入收藏 | 网站地图 | 友情链接 |