定制兔年春节头像

基于vue3+typescript和fabric.js的头像合成工具,用户可自由搭配效果图定制兔年春节头像,操作简单无需微调,代码质量高扩展性强。

推荐——定制兔年春节头像- 项目地址:https://github.com/xiaoli1999/custom-rabbitImage- 类别:JS- 项目标题:定制兔年春节头像是一个小工具;用户可自由选择效果图搭配,定制自己喜欢的春节头像- 项目描述:该项目是基于vue3+typescript、fabric.js的一款头像合成工具。用户可以用来定制春节头像(兔年),开发者可以在次基础上二开。特点:使用最新的语言及工具,代码质量高,扩展性强,可玩度高;该工具轻量、灵活、自由,用户体验感较好。初衷:头像已经深入到大家的生活当中,wx、qq、抖音、github等平台都需要展示头像;春节将至,想让大家都有个春节头像、喜气洋洋过个春节。- 项目预览主站地址✈️ <br />github pages✈️ - 亮点:操作简单,基本可以直接合成(设计师已经针对头像做了适配),不需要再进行微调。效果图喜庆、可爱、俏皮。- 示例代码:typescript/** * @file init.ts 初始化 * @description 初始化画布、遮罩层、可视区域等 *//** * @function initCanvas 初始化画布 * @param { String } inkId 画布dom id * @param { Object } size 画布大小 { width, height } * @param { Boolean } isStatic 是否静态画布 * @return { Object } Canvas 返回画布实例对象 */export const initCanvas = (inkId: string, size: canvasType, isStatic: boolean) => { const Canvas: Canvas | StaticCanvas = new fabric[isStatic ? 'StaticCanvas' : 'Canvas'](inkId, size) Canvas.preserveObjectStacking = true Canvas.selection = false Canvas.centeredScaling = true return Canvas}- 截图:预览- 后续更新计划:目前版本迭代到了v1.4.0,后面持续优化改进!