1. 程式人生 > >基於canvas的圖片剪裁工具

基於canvas的圖片剪裁工具

工具下載地址:https://github.com/zforler/clip

直接再瀏覽器中開啟index.html即可(基於canvas的圖片操作,在谷歌瀏覽器中會受到同源策略的限制,放到服務容器裡面沒關係)。

<script src="js/Shape.js"></script><!--核心檔案-->
<script src="js/Rectangle.js"></script><!--剪裁形狀-->

<script src="js/clip.js"></script><!--核心檔案-->

//使用

let clip = new Clip({
        imgURL: 'girl.jpg'//需要剪裁的圖片url

    });

clip.setShape(new Rectangle());//設定剪裁形狀,繼承Shape類可以實現自定義形狀