您现在的位置:首页 >> 前端 >> 内容

裁切图片

时间:2017/6/10 10:34:00 点击:

  核心提示:使用方法 :var cb = new clipBitmap().init({ctx : document.getElementById(ctx), //存放canvas的容器mode : O,// 模...

使用方法 :

var cb = new clipBitmap().init({

  'ctx' : document.getElementById('ctx'), //存放canvas的容器
  'mode' : 'O',  // 模式 O 或者 R 
  'img' : 'res/pic.jpg', //背景图
  'rimg' : 'res/timg.png' //定位图片,可忽略。忽略后将调用默认的定位图
});


$('#clip').on('click', function(){
  if (cb != null) {
    var img = cb.clipG();  //调用clipG()方法会返回base64数据的img
    document.body.innerHTML = '';
    document.body.appendChild(img)
  }
});
上面的modeO代表定位图片为圆形,R为矩形。 默认为矩形,此参数能省略。

 

rimg为定位的图片,省略的话则会根据mode是矩形或者圆形调用相应的图片
 

Tags:裁切 切图 图片   
作者:网络 来源:不详