迷你图 0.5.2+
Facade API | 付费版本 | 需要 Univer 服务端 | Univer on Node.js | Preset |
---|---|---|---|---|
✅ | ✅ | - | ✅ | - |
迷你图是一种简洁、直观的小型图表,通常嵌入在表格单元格中,用于快速展示数据趋势或关键指标。
安装
npm install @univerjs-pro/sheets-sparkline @univerjs-pro/sheets-sparkline-ui
import { LocaleType, Tools } from '@univerjs/core';
import { UniverSheetSparklinePlugin } from '@univerjs-pro/sheets-sparkline';
import { UniverSheetSparklineUIPlugin } from '@univerjs-pro/sheets-sparkline-ui';
import SheetsSparklineUIZhCN from '@univerjs-pro/sheets-sparkline-ui/locale/zh-CN';
import '@univerjs-pro/sheets-sparkline-ui/lib/index.css';
const univer = new Univer({
theme: defaultTheme,
locale: LocaleType.ZH_CN,
locales: {
[LocaleType.ZH_CN]: Tools.deepMerge(
SheetsSparklineUIZhCN
),
},
});
univer.registerPlugin(UniverSheetSparklinePlugin);
univer.registerPlugin(UniverSheetSparklineUIPlugin);
Facade API
添加迷你图
const univerAPI = FUniver.newAPI(univer);
const fWorkbook = univerAPI.getActiveWorkbook();
const fSheet = fWorkbook.getActiveSheet();
fSheet.addSparkline([{startRow:0, endRow:1, startColumn:0, endColumn:0}],[{startRow:2, endRow:2, startColumn:0, endColumn:0}])
组合迷你图和取消组合迷你图
const univerAPI = FUniver.newAPI(univer);
const fWorkbook = univerAPI.getActiveWorkbook();
const fSheet = fWorkbook.getActiveSheet();
fSheet.composeSparkline([{startRow:0, endRow:10, startColumn:0, endColumn:10}])
fSheet.unComposeSparkline([{startRow:0, endRow:10, startColumn:0, endColumn:10}])
FSparkline
和 FSparklineGroup
在 fWorksheet 实例上提供了根据单元格位置获取迷你图和迷你图组实例的方法
const univerAPI = FUniver.newAPI(univer);
const fWorkbook = univerAPI.getActiveWorkbook();
const unitId = fWorkbook.getId();
const fSheet = fWorkbook.getActiveSheet();
const subUnitId = fSheet.getSheetId();
const sparkline = fSheet.getSparklineByCell(2,0);
const sparklineGroup = fSheet.getSparklineGroupByCell(2,0);
迷你图和迷你图组实例中各有一些方法用来操作迷你图和迷你图组
FSparkline
方法 | 描述 |
---|---|
changeDataSource | 修改当前单元格内迷你图的数据源和放置位置 |
removeSparkline | 删除当前单元格内的迷你图 |
FSparklineGroup
方法 | 描述 |
---|---|
changeDataSource | 修改当前单元格内迷你图组的数据源和放置位置 |
removeSparklineGroup | 删除当前单元格内的迷你图所在的迷你图组 |
setConfig | 更改当前单元格内的迷你图所在的迷你图组的配置 |