editImage(修改图片作品)

通过已知的用户作品ID,编辑图片

在编辑器实例化完毕后, 可以通过 editImage方法,编辑用户以前编辑的历史图片(二次编辑)

editor.editImage('作品ID')// 在 editor 导出后可以通过 workId 字段获取

例子

下面例子为,点击按钮时,打开 ID 为 359445 的图片进行编辑,编辑完成后,编辑重新将设计结果图插入到页面中进行二次编辑

<!DOCTYPE html>
<html>
    <head>
        <script src="https://open.gaoding.com/assets/editor-sdk.js"></script>
    </head>
    <body>
        <input type="file" />
        <script type="text/javascript">
            const editor = window.gaoding.createImageEditor({
                appId: '在稿定开放平台应用详情里查看',
            });
            async function create(e) {
                let res = await editor.importImage(e.target.files[0]);
                if (res) {
                    // 二次编辑
                    res = editor.editImage(id: res.workId);
                    if (res) {
                        editor.close();
                        // files 为导出的文件数组
                        const { files } = res;
                        const url == URL.createObjectURL(files[0]);
                        const img = document.createElement('img');
                        img.src = url;
                        document.body.append(img);
                    }
                }
            }
            document.querySelector('input').addEventListener('change', create);
        </script>
    </body>
</html>

注意: 如果没有通过 authorize 进行账户绑定,可能会出现用户信息丢失导致,workId 无法正常使用

参数说明

id

类型: string | number

用户以前通过 importImage 返回得到的 workId


options.fileTypes

版本: 2.0+

类型: string[]

控制导出文件的格式类型。 目前支持的格式类型有 'jpg' | 'png'

如果 fileTypes 传递的导出类型不符当前模板的导出格式时,将显示该默认的导出格式类型选项。

比如 fileTypes 传递的是 gif 但是当前使用的是个图片模板。 那么导出类型还是只会展示 jpg png

editor.editImage('xxx', {
    fileTypes: ['png']
})

options.disableModules

版本: 2.0+

类型: string[]

该方法用于隐藏编辑器对应模块。目前支持的隐藏模块如下

模块名

说明

panel.template

左侧模板面板

panel.ajustment

左侧调整面板

panel.mark

左侧标记面板

panel.text

左侧文字面板

panel.border

左侧边框面板

panel.elment

左侧元素面板

panel.watermark

左侧水印面板

panel.upload

左侧我的面板

// 隐藏模板面板和我的面板
editor.editImage('xxx', {
    disableModules: ['panel.template', 'panel.upload']
})

返回结果

类型: Promise<false | { files: Blob[]; workId: string; title: string; type: string; }>

如果返回 false 标识用户关闭了编辑器的默认弹窗

files 为导出的文件数组。 workId 为作品ID, 开放者可以通过这个ID进行二次编辑

title 为该设计作品的标题。 type为导出文件的类型 有 png jpg

注意项: 因为返回的是一个 Promise, 所以不管用户完成多少次, 返回的只有第一次导出的结果。 如果要持续对用户导出结果做出处理。请使用 editor.onSave 方法。