浮动图片
| Facade API | 付费版本 | 需要 Univer 服务端 | Univer on Node.js | Preset |
|---|---|---|---|---|
| - | - | - | - | UniverSheetsDrawingPreset |
插入浮动图片，支持拖拽调整大小和位置。
该功能包含以下插件包：
@univerjs/drawing- 基础插图插件@univerjs/drawing-ui- 基础插图 UI 插件@univerjs/sheets-drawing- sheet 插图插件@univerjs/sheets-drawing-ui- sheet 插图 UI 插件
Presets 安装
import { createUniver, defaultTheme, LocaleType, Tools } from '@univerjs/presets';
import { UniverSheetsCorePreset } from '@univerjs/presets/preset-sheets-core';
import UniverPresetSheetsCoreZhCN from '@univerjs/presets/preset-sheets-core/locales/zh-CN';
import { UniverSheetsDrawingPreset } from '@univerjs/presets/preset-sheets-drawing';
import UniverPresetSheetsDrawingZhCN from '@univerjs/presets/preset-sheets-drawing/locale/zh-CN';
const { univerAPI } = createUniver({
locale: LocaleType.ZH_CN,
locales: {
zhCN: Tools.deepMerge(
{},
UniverPresetSheetsCoreZhCN,
UniverPresetSheetsDrawingZhCN
),
},
theme: defaultTheme,
presets: [
UniverSheetsCorePreset(),
UniverSheetsDrawingPreset()
]
});高级安装
npm install @univerjs/drawing @univerjs/drawing-ui @univerjs/sheets-drawing @univerjs/sheets-drawing-uiimport { LocaleType, Tools } from '@univerjs/core';
import { IImageIoService, UniverDrawingPlugin } from '@univerjs/drawing';
import { UniverDrawingUIPlugin } from '@univerjs/drawing-ui';
import { UniverSheetsDrawingPlugin } from '@univerjs/sheets-drawing';
import { UniverSheetsDrawingUIPlugin } from '@univerjs/sheets-drawing-ui';
import DrawingUIZhCN from '@univerjs/drawing-ui/locale/zh-CN';
import SheetsDrawingUIZhCN from '@univerjs/sheets-drawing-ui/locale/zh-CN';
import '@univerjs/drawing-ui/lib/index.css';
import '@univerjs/sheets-drawing-ui/lib/index.css';
import '@univerjs/sheets-drawing-ui/facade';
const univer = new Univer({
theme: defaultTheme,
locale: LocaleType.ZH_CN,
locales: {
[LocaleType.ZH_CN]: Tools.deepMerge(
DrawingUIZhCN,
SheetsDrawingUIZhCN,
),
},
});
// 当不使用协同插件时，注册代码如下：
univer.registerPlugin(UniverDrawingPlugin);
univer.registerPlugin(UniverDrawingUIPlugin);
univer.registerPlugin(UniverSheetsDrawingPlugin);
univer.registerPlugin(UniverSheetsDrawingUIPlugin);
// 使用协同插件时，需要提供 `override` 配置：
univer.registerPlugin(UniverDrawingPlugin, {
override: [[IImageIoService, null]], // 协同插件将会提供该实现
});