d-utils/dist/es/synthesis/index.js

d-utils

/**
 * d-utils  version: 4.0.3
 * by ifmiss
 */
import"../checkType.js";import{c as t,d as e,a as s}from"../_tslib-05983193.js";import"../isObject.js";import i from"../log/index.js";import{ImageUtilsType as n}from"../type.js";var o=/** @class */function(){function o(t,e){
/**
         * 基于当前屏幕的比例
         */
this.persent=1,
/**
         * canvas的元素
         */
this.canvas=null,
/**
         * context canvas 上下文
         */
this.context=null,
/**
         * 合并的背景地址
         */
this.mainResource="",
/**
         * canvas的宽度  实际上数合并背景的宽度
         */
this.canvasWidth=0,
/**
         * canvas的高度  实际上数合并背景的高度
         */
this.canvasHeight=0,
/**
         * 资源列表
         */
this.resourceList=[],this.mainResource=t,e&&(this.persent=e)}return o.prototype.addSourse=function(t){return this.resourceList.push(t),this},
/**
     * 加载图片
     */
o.prototype.loadResourse=function(n,o){return t(this,void 0,void 0,(function(){var t;return e(this,(function(e){return(t=new Image).crossOrigin="anonymous",t.src=n,[2/*return*/,new Promise((function(e,r){t.onload=function(){var i=o?s({ref:t},o):t;e(i)},t.onerror=function(){i.error(n,"[d-utils] ImageUtils loadResourse 裁剪图片加载错误"),r()}}))]}))}))},o.prototype.composeMainResource=function(t){var e=t.width/t.height;this.canvasWidth=t.width*this.persent,this.canvasHeight=this.canvasWidth/e,
// 设置canvas的宽高
this.canvas.width=this.canvasWidth,this.canvas.height=this.canvasHeight,this.context.drawImage(t,0,0,this.canvasWidth,this.canvasHeight),this.context.restore()},
/**
     * @description cavans绘制效果
     * @param image addSourse 添加的数据信息
     */
o.prototype.renderResource=function(t){var e={left:t.left*this.canvasWidth,top:t.top*this.canvasHeight,width:t.width*this.canvasWidth,height:t.height*this.canvasHeight};this.context.save(),t.needRound?(
// 走圆形绘制图片 此时都视为正方形
this.context.arc(e.width/2+e.left,e.width/2+e.top,e.width/2,0,2*Math.PI,!1),this.context.clip(),this.context.drawImage(t.ref,e.left,e.top,e.width,e.width),this.context.restore()):(
// 走正常绘制
this.context.drawImage(t.ref,e.left,e.top,e.width,e.height),this.context.restore())},
/**
     * @description 初始化canvas的设置
     * @return { Promise } 返回合成成功的image对象信息
     */
o.prototype.compose=function(){return t(this,void 0,void 0,(function(){var t,s,i,o=this;return e(this,(function(e){switch(e.label){case 0:return this.canvas=document.createElement("canvas"),this.context=this.canvas.getContext("2d"),[4/*yield*/,this.loadResourse(this.mainResource)];case 1:return t=e.sent(),this.composeMainResource(t),s=[],i=this.resourceList.reduce((function(t,e,s){if(e.type===n.TextType.Image){var i=o.loadResourse(e.content,e);t.push(i)}else o.context.font=e.fanmily||n.FontStyle.fanmily,o.context.fillStyle=e.color||n.FontStyle.color,o.context.fillText(e.content,e.left*o.canvasWidth,e.top*o.canvasHeight);return t}),s),[4/*yield*/,Promise.all(i)];case 2:
// 再次绘制
return[4/*yield*/,e.sent().forEach((function(t){o.renderResource(t)}))];case 3:
// 再次绘制
return e.sent(),[2/*return*/,Promise.resolve(this.convertCanvasToImage())]}}))}))},
/**
     * @description canvase转换成图片
     * @return { Image } 返回一个new Image的实例
     */
o.prototype.convertCanvasToImage=function(){var t=new Image;return t.src=this.canvas.toDataURL("image/png",1),i.success(t,"[d-utils] ImageUtils convertCanvasToImage 图片对象创建成功"),t},o}();export default o;