介绍
http://ui.toast.com/tui-image-editor
npm i tui-image-editor -S
强大的图片编辑器,可直接调用,或者通过 api 调用编辑器的能力
使用
依赖于 fabric ,安装时会安装 node 版本,windows 安装起来比较困难;
可通过引用 .min.js
版的打包库文件来使用。
<div class="tui-image-editor"></div>
<script src="https://api-storage.cloud.toast.com/v1/AUTH_e18353c4ea5746c097143946d0644e61/toast-ui-cdn/tui-image-editor/v3.11.0/example/fabric-v4.2.0.js"></script>
<script src="https://uicdn.toast.com/tui.code-snippet/v1.5.0/tui-code-snippet.min.js"></script>
<script src="https://uicdn.toast.com/tui-color-picker/v2.2.6/tui-color-picker.min.js"></script>
<script type="text/javascript" src="../dist/tui-image-editor.js"></script>
<script>
// Image editor
var imageEditor = new tui.ImageEditor(".tui-image-editor", {
cssMaxWidth: 700,
cssMaxHeight: 500,
selectionStyle: {
cornerSize: 20,
rotatingPointOffset: 70,
},
});
</script>