码迷,mamicode.com
首页 > Web开发 > 详细

js生成图片

时间:2018-01-07 11:49:27      阅读:228      评论:0      收藏:0      [点我收藏+]

标签:class   png   lte   create   element   new   bsp   图片   document   

var image = new Image();
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
var img = document.getElementById("scream");
ctx.font = "10px Arial";

function createImg(name, zuowei, color) {
    //  姓名
    ctx.fillText(name, 93, 373);
    ctx.fillText(name, 393, 370);
    //  座位号
    ctx.font = "bold 20px Arial";
    ctx.fillText(zuowei, 216, 350);
    ctx.fillText(zuowei, 393, 350);
    //  座位颜色
    ctx.font = "bold 20px Arial";
    ctx.fillText(color, 264, 350);
    ctx.fillText(color, 441, 350);
    //  生成图片
    image = c.toDataURL("image/png");
    return image;
}

ctx.drawImage(img, 0, 0, 550, 520);
var src = createImg(name, zuowei, color);
$(‘#box‘).attr(‘src‘, src);

 

js生成图片

标签:class   png   lte   create   element   new   bsp   图片   document   

原文地址:https://www.cnblogs.com/lvyueyang/p/8216668.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!