海报制作banner 编辑器效果，做图神器，在线ps-html代码-BFW代码库

海报制作banner 编辑器效果，做图神器，在线ps

代码语言：html

所属分类：其他

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <script id="bfwone" data="dep=jquery.17&err=0" type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/bfwone.js"></script>
    <script type="text/javascript">
        var obj = null;
        bready(function() {

            use(["subjx", "subjx"], function() {


                $("#savebtn").click(function() {
                    if (obj != null) {
                        obj.disable();
                    }
                    var svgXml = $('#svg-container').prop('outerHTML');
                    if (svgXml == "") {
                        return;
                    }

                    // alert(svgXml);
                    $("#previewimg").attr("src", 'data:image/svg+xml;base64,' + window.btoa(unescape(encodeURIComponent(svgXml))));
                    return;
                    var image = new Image();
                    image.src = 'data:image/svg+xml;base64,' + window.btoa(unescape(encodeURIComponent(svgXml))); //给图片对象写入base64编码的svg流
                    $("body")[0].append(image);
                    return;
                });
                const htmlMethods = {
                    onInit(el) {
                        //console.log('init');
                    },
                    onMove() {
                        this.el.childNodes[1].innerHTML = 'Draggable';
                    },
                    onResize(dx,
                        dy,
                        handle) {
                        this.el.childNodes[1].innerHTML = 'Resizable';
                    },
                    onRotate(rad) {
                        this.el.childNodes[1].innerHTML = 'Rotatable';
                    },
                    onDrop(e,
                        el) {
                        //console.log('is dropped');
                    },
                    onDestroy(el) {
                        //console.log('is destroyed');
                    }
                };
                // create Observable instance
                const obs = subjx.createObservable();
                const svgOptions = {
                    container: '#svg-container',

                    proportions: false,
                    //rotationPoint: true,
                    // themeColor: 'white',
                    each: {
                        resize: true,
                        move: true,
                        rotate: true
                    },
                    snap: {
                        x: 20,
                        y: 20,
                        angle: 25
                    },
                    cursorMove: 'move',
                    cursorRotate: 'crosshair',
                    cursorResize: 'pointer',
                    //...htmlMethods
                };

                subjx('.drag-svg').on('click',
                    e => {
                        //
                        if (e.currentTarget.classList.contains('sjx-drag')) return;
                        if (obj != null) {
                            obj.disable();
   .........完整代码请登录后点击上方下载按钮下载查看