Skip to content

yongKAY/mcanvas

 
 

Repository files navigation

Mcanvas.js

Example

Git

Introduction

Mcanvas is a plugin that can easily compose the image, text, watermark and export a image of base64 finally. It provides some simple api that based on canvas, in order to make your work more efficiently and conveniently.

Installation

  • You can download the latest version from the GitHub
  • use a npm CDN.
  • Or you can install via npm:
npm install mcanvas --save

Basic Usage

// create the canvas by width and height;
let mc = new MC(width,height);

// prepare background-image
mc.background(image,{
    left:0,
    top:0,
    color:'#000000',
    type:'origin',
})

// prepare the image material, add into queue;
.add('images/nose.png',{
    width:183,
    pos:{
        x:250,
        y:369,
        scale:0.84,
        rotate:1,
    },
})

// add text;
.text('normal<br><s>smallsmall</s>',{
    width:'300px',
    align:'center',
    pos:{
        x:0,
        y:0,
    },
})

// prepare watermark;
.watermark(img ,{
    width:'40%',
    pos:'rightBottom',
})

// draw all material that prepared before, and get the base64-image
.draw( b64 =>{
    console.log(b64);
});

Document

English | 中文版

License

MIT

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 84.9%
  • CSS 9.3%
  • HTML 5.8%