@univerjs/sheets-drawing-ui 0.6.0-nightly.202502171606 → 0.6.0-nightly.202502191606
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/facade.js +1 -1
- package/lib/es/facade.js +490 -352
- package/lib/types/facade/f-event.d.ts +61 -45
- package/lib/types/facade/f-over-grid-image.d.ts +378 -217
- package/lib/types/facade/f-worksheet.d.ts +290 -131
- package/lib/types/services/canvas-float-dom-manager.service.d.ts +2 -2
- package/lib/umd/facade.js +1 -1
- package/package.json +12 -12
|
@@ -13,222 +13,344 @@ export declare class FOverGridImageBuilder {
|
|
|
13
13
|
constructor(unitId: string, subUnitId: string, _injector: Injector);
|
|
14
14
|
/**
|
|
15
15
|
* Set the initial image configuration for the image builder.
|
|
16
|
-
* @param image The image
|
|
17
|
-
* @returns The
|
|
16
|
+
* @param {ISheetImage} image - The image configuration
|
|
17
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
18
18
|
* @example
|
|
19
19
|
* ```ts
|
|
20
|
-
* // create a new image builder.
|
|
21
|
-
*
|
|
22
|
-
* const
|
|
23
|
-
* const
|
|
24
|
-
* const
|
|
25
|
-
*
|
|
26
|
-
*
|
|
27
|
-
*
|
|
28
|
-
*
|
|
29
|
-
*
|
|
30
|
-
*
|
|
31
|
-
*
|
|
32
|
-
*
|
|
20
|
+
* // create a new image builder and set initial image configuration.
|
|
21
|
+
* // then build `ISheetImage` and insert it into the sheet, position is start from F6 cell.
|
|
22
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
23
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
24
|
+
* const image = await fWorksheet.newOverGridImage()
|
|
25
|
+
* .setImage({
|
|
26
|
+
* drawingId: '123456',
|
|
27
|
+
* drawingType: univerAPI.Enum.DrawingType.DRAWING_IMAGE,
|
|
28
|
+
* imageSourceType: univerAPI.Enum.ImageSourceType.BASE64,
|
|
29
|
+
* source: 'https://avatars.githubusercontent.com/u/61444807?s=48&v=4',
|
|
30
|
+
* unitId: fWorkbook.getId(),
|
|
31
|
+
* subUnitId: fWorksheet.getSheetId(),
|
|
32
|
+
* })
|
|
33
|
+
* .setColumn(5)
|
|
34
|
+
* .setRow(5)
|
|
35
|
+
* .buildAsync();
|
|
36
|
+
* fWorksheet.insertImages([image]);
|
|
33
37
|
* ```
|
|
34
38
|
*/
|
|
35
39
|
setImage(image: ISheetImage): FOverGridImageBuilder;
|
|
36
40
|
/**
|
|
37
|
-
* Set the
|
|
38
|
-
* @param
|
|
39
|
-
* @
|
|
41
|
+
* Set the source of the image.
|
|
42
|
+
* @param {string} source - The source of the image
|
|
43
|
+
* @param {ImageSourceType} [sourceType] - The source type of the image, default is URL
|
|
44
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
40
45
|
* @example
|
|
41
46
|
* ```ts
|
|
42
|
-
* // create a new image builder.
|
|
43
|
-
*
|
|
44
|
-
* const
|
|
45
|
-
* const
|
|
46
|
-
* const
|
|
47
|
-
*
|
|
47
|
+
* // create a new image builder and set image source.
|
|
48
|
+
* // then build `ISheetImage` and insert it into the sheet, position is start from F6 cell.
|
|
49
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
50
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
51
|
+
* const image = await fWorksheet.newOverGridImage()
|
|
52
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
53
|
+
* .setColumn(5)
|
|
54
|
+
* .setRow(5)
|
|
55
|
+
* .buildAsync();
|
|
56
|
+
* fWorksheet.insertImages([image]);
|
|
48
57
|
* ```
|
|
49
58
|
*/
|
|
50
59
|
setSource(source: string): FOverGridImageBuilder;
|
|
51
60
|
setSource(source: string, sourceType?: ImageSourceType): FOverGridImageBuilder;
|
|
52
|
-
|
|
61
|
+
/**
|
|
62
|
+
* Get the source of the image
|
|
63
|
+
* @returns {string} The source of the image
|
|
64
|
+
* @example
|
|
65
|
+
* ```ts
|
|
66
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
67
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
68
|
+
* const images = fWorksheet.getImages();
|
|
69
|
+
* images.forEach((image) => {
|
|
70
|
+
* console.log(image, image.toBuilder().getSource());
|
|
71
|
+
* });
|
|
72
|
+
* ```
|
|
73
|
+
*/
|
|
74
|
+
getSource(): string;
|
|
75
|
+
/**
|
|
76
|
+
* Get the source type of the image
|
|
77
|
+
* @returns {ImageSourceType} The source type of the image
|
|
78
|
+
* @example
|
|
79
|
+
* ```ts
|
|
80
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
81
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
82
|
+
* const images = fWorksheet.getImages();
|
|
83
|
+
* images.forEach((image) => {
|
|
84
|
+
* console.log(image, image.toBuilder().getSourceType());
|
|
85
|
+
* });
|
|
86
|
+
* ```
|
|
87
|
+
*/
|
|
53
88
|
getSourceType(): ImageSourceType;
|
|
54
89
|
/**
|
|
55
|
-
* Set the position of the image
|
|
56
|
-
* @param column
|
|
57
|
-
* @returns The
|
|
90
|
+
* Set the horizontal position of the image
|
|
91
|
+
* @param {number} column - The column index of the image start position
|
|
92
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
58
93
|
* @example
|
|
59
94
|
* ```ts
|
|
60
|
-
* // create a new image builder.
|
|
61
|
-
*
|
|
62
|
-
* const
|
|
63
|
-
* const
|
|
64
|
-
* const
|
|
65
|
-
*
|
|
95
|
+
* // create a new image builder and set image source.
|
|
96
|
+
* // then build `ISheetImage` and insert it into the sheet, position is start from F6 cell.
|
|
97
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
98
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
99
|
+
* const image = await fWorksheet.newOverGridImage()
|
|
100
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
101
|
+
* .setColumn(5)
|
|
102
|
+
* .setRow(5)
|
|
103
|
+
* .buildAsync();
|
|
104
|
+
* fWorksheet.insertImages([image]);
|
|
66
105
|
* ```
|
|
67
106
|
*/
|
|
68
107
|
setColumn(column: number): FOverGridImageBuilder;
|
|
69
108
|
/**
|
|
70
|
-
* Set the position of the image
|
|
71
|
-
* @param row The
|
|
72
|
-
* @returns The
|
|
109
|
+
* Set the vertical position of the image
|
|
110
|
+
* @param {number} row - The row index of the image start position
|
|
111
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
73
112
|
* @example
|
|
74
113
|
* ```ts
|
|
75
|
-
* // create a new image builder.
|
|
76
|
-
*
|
|
77
|
-
* const
|
|
78
|
-
* const
|
|
79
|
-
* const
|
|
80
|
-
*
|
|
114
|
+
* // create a new image builder and set image source.
|
|
115
|
+
* // then build `ISheetImage` and insert it into the sheet, position is start from F6 cell.
|
|
116
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
117
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
118
|
+
* const image = await fWorksheet.newOverGridImage()
|
|
119
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
120
|
+
* .setColumn(5)
|
|
121
|
+
* .setRow(5)
|
|
122
|
+
* .buildAsync();
|
|
123
|
+
* fWorksheet.insertImages([image]);
|
|
81
124
|
* ```
|
|
82
125
|
*/
|
|
83
126
|
setRow(row: number): FOverGridImageBuilder;
|
|
84
127
|
/**
|
|
85
|
-
* Set the
|
|
86
|
-
* @param offset The offset
|
|
87
|
-
* @returns The
|
|
128
|
+
* Set the horizontal offset of the image
|
|
129
|
+
* @param {number} offset - The column offset of the image start position, pixel unit
|
|
130
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
88
131
|
* @example
|
|
89
132
|
* ```ts
|
|
90
|
-
* // create a new image builder.
|
|
91
|
-
*
|
|
92
|
-
* const
|
|
93
|
-
* const
|
|
94
|
-
* const
|
|
95
|
-
*
|
|
133
|
+
* // create a new image builder and set image source.
|
|
134
|
+
* // then build `ISheetImage` and insert it into the sheet, position is start from F6 cell and horizontal offset is 10px.
|
|
135
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
136
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
137
|
+
* const image = await fWorksheet.newOverGridImage()
|
|
138
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
139
|
+
* .setColumn(5)
|
|
140
|
+
* .setRow(5)
|
|
141
|
+
* .setColumnOffset(10)
|
|
142
|
+
* .buildAsync();
|
|
143
|
+
* fWorksheet.insertImages([image]);
|
|
96
144
|
* ```
|
|
97
145
|
*/
|
|
98
146
|
setColumnOffset(offset: number): FOverGridImageBuilder;
|
|
99
147
|
/**
|
|
100
|
-
* Set the
|
|
101
|
-
* @param offset The offset
|
|
102
|
-
* @returns The
|
|
148
|
+
* Set the vertical offset of the image
|
|
149
|
+
* @param {number} offset - The row offset of the image start position, pixel unit
|
|
150
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
103
151
|
* @example
|
|
104
152
|
* ```ts
|
|
105
|
-
* // create a new image builder.
|
|
106
|
-
*
|
|
107
|
-
* const
|
|
108
|
-
* const
|
|
109
|
-
* const
|
|
110
|
-
*
|
|
153
|
+
* // create a new image builder and set image source.
|
|
154
|
+
* // then build `ISheetImage` and insert it into the sheet, position is start from F6 cell and vertical offset is 10px.
|
|
155
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
156
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
157
|
+
* const image = await fWorksheet.newOverGridImage()
|
|
158
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
159
|
+
* .setColumn(5)
|
|
160
|
+
* .setRow(5)
|
|
161
|
+
* .setRowOffset(10)
|
|
162
|
+
* .buildAsync();
|
|
163
|
+
* fWorksheet.insertImages([image]);
|
|
111
164
|
* ```
|
|
112
165
|
*/
|
|
113
166
|
setRowOffset(offset: number): FOverGridImageBuilder;
|
|
114
167
|
/**
|
|
115
|
-
*
|
|
116
|
-
* @param width The width of the image,
|
|
117
|
-
* @returns The
|
|
168
|
+
* Set the width of the image
|
|
169
|
+
* @param {number} width - The width of the image, pixel unit
|
|
170
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
118
171
|
* @example
|
|
119
172
|
* ```ts
|
|
120
|
-
* // create a new image builder.
|
|
121
|
-
*
|
|
122
|
-
* const
|
|
123
|
-
* const
|
|
124
|
-
* const
|
|
125
|
-
*
|
|
173
|
+
* // create a new image builder and set image source.
|
|
174
|
+
* // then build `ISheetImage` and insert it into the sheet, position is start from F6 cell, width is 120px and height is 50px.
|
|
175
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
176
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
177
|
+
* const image = await fWorksheet.newOverGridImage()
|
|
178
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
179
|
+
* .setColumn(5)
|
|
180
|
+
* .setRow(5)
|
|
181
|
+
* .setWidth(120)
|
|
182
|
+
* .setHeight(50)
|
|
183
|
+
* .buildAsync();
|
|
184
|
+
* fWorksheet.insertImages([image]);
|
|
126
185
|
* ```
|
|
127
186
|
*/
|
|
128
187
|
setWidth(width: number): FOverGridImageBuilder;
|
|
129
188
|
/**
|
|
130
189
|
* Set the height of the image
|
|
131
|
-
* @param height The height of the image,
|
|
132
|
-
* @returns The
|
|
190
|
+
* @param {number} height - The height of the image, pixel unit
|
|
191
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
133
192
|
* @example
|
|
134
193
|
* ```ts
|
|
135
|
-
* // create a new image builder.
|
|
136
|
-
*
|
|
137
|
-
* const
|
|
138
|
-
* const
|
|
139
|
-
* const
|
|
140
|
-
*
|
|
194
|
+
* // create a new image builder and set image source.
|
|
195
|
+
* // then build `ISheetImage` and insert it into the sheet, position is start from F6 cell, width is 120px and height is 50px.
|
|
196
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
197
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
198
|
+
* const image = await fWorksheet.newOverGridImage()
|
|
199
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
200
|
+
* .setColumn(5)
|
|
201
|
+
* .setRow(5)
|
|
202
|
+
* .setWidth(120)
|
|
203
|
+
* .setHeight(50)
|
|
204
|
+
* .buildAsync();
|
|
205
|
+
* fWorksheet.insertImages([image]);
|
|
141
206
|
* ```
|
|
142
207
|
*/
|
|
143
208
|
setHeight(height: number): FOverGridImageBuilder;
|
|
144
209
|
/**
|
|
145
210
|
* Set the anchor type of the image, whether the position and size change with the cell
|
|
146
|
-
* @param anchorType The anchor type
|
|
147
|
-
* @returns The
|
|
211
|
+
* @param {SheetDrawingAnchorType} anchorType - The anchor type of the image
|
|
212
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
148
213
|
* @example
|
|
149
214
|
* ```ts
|
|
150
|
-
*
|
|
151
|
-
* const
|
|
152
|
-
*
|
|
153
|
-
*
|
|
154
|
-
*
|
|
155
|
-
*
|
|
215
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
216
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
217
|
+
*
|
|
218
|
+
* // image1 position is start from A6 cell, anchor type is Position.
|
|
219
|
+
* // Only the position of the drawing follows the cell changes. When rows or columns are inserted or deleted, the position of the drawing changes, but the size remains the same.
|
|
220
|
+
* const image1 = await fWorksheet.newOverGridImage()
|
|
221
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
222
|
+
* .setColumn(0)
|
|
223
|
+
* .setRow(5)
|
|
224
|
+
* .setAnchorType(univerAPI.Enum.SheetDrawingAnchorType.Position)
|
|
225
|
+
* .buildAsync();
|
|
226
|
+
*
|
|
227
|
+
* // image2 position is start from C6 cell, anchor type is Both.
|
|
228
|
+
* // The size and position of the drawing follow the cell changes. When rows or columns are inserted or deleted, the size and position of the drawing change accordingly.
|
|
229
|
+
* const image2 = await fWorksheet.newOverGridImage()
|
|
230
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
231
|
+
* .setColumn(2)
|
|
232
|
+
* .setRow(5)
|
|
233
|
+
* .setAnchorType(univerAPI.Enum.SheetDrawingAnchorType.Both)
|
|
234
|
+
* .buildAsync();
|
|
235
|
+
*
|
|
236
|
+
* // image3 position is start from E6 cell, anchor type is None.
|
|
237
|
+
* // The size and position of the drawing do not follow the cell changes. When rows or columns are inserted or deleted, the position and size of the drawing remain unchanged.
|
|
238
|
+
* const image3 = await fWorksheet.newOverGridImage()
|
|
239
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
240
|
+
* .setColumn(4)
|
|
241
|
+
* .setRow(5)
|
|
242
|
+
* .setAnchorType(univerAPI.Enum.SheetDrawingAnchorType.None)
|
|
243
|
+
* .buildAsync();
|
|
244
|
+
*
|
|
245
|
+
* // insert images into the sheet
|
|
246
|
+
* fWorksheet.insertImages([image1, image2, image3]);
|
|
247
|
+
*
|
|
248
|
+
* // after 2 seconds, set the row height of the 5th row to 100px and insert a row before the 5th row.
|
|
249
|
+
* // then observe the position and size changes of the images.
|
|
250
|
+
* setTimeout(() => {
|
|
251
|
+
* fWorksheet.setRowHeight(5, 100).insertRowBefore(5);
|
|
252
|
+
* }, 2000);
|
|
156
253
|
* ```
|
|
157
254
|
*/
|
|
158
255
|
setAnchorType(anchorType: SheetDrawingAnchorType): FOverGridImageBuilder;
|
|
159
256
|
/**
|
|
160
257
|
* Set the cropping region of the image by defining the top edges, thereby displaying the specific part of the image you want.
|
|
161
|
-
* @param top
|
|
162
|
-
* @returns The
|
|
258
|
+
* @param {number} top - The number of pixels to crop from the top of the image
|
|
259
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
163
260
|
* @example
|
|
164
261
|
* ```ts
|
|
165
|
-
* // create a new image builder.
|
|
166
|
-
*
|
|
167
|
-
* const
|
|
168
|
-
* const
|
|
169
|
-
* const
|
|
170
|
-
*
|
|
262
|
+
* // create a new image builder and set image source.
|
|
263
|
+
* // then build `ISheetImage` and insert it into the sheet, position is start from F6 cell, top crop is 10px.
|
|
264
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
265
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
266
|
+
* const image = await fWorksheet.newOverGridImage()
|
|
267
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
268
|
+
* .setColumn(5)
|
|
269
|
+
* .setRow(5)
|
|
270
|
+
* .setCropTop(10)
|
|
271
|
+
* .buildAsync();
|
|
272
|
+
* fWorksheet.insertImages([image]);
|
|
171
273
|
* ```
|
|
172
274
|
*/
|
|
173
275
|
setCropTop(top: number): FOverGridImageBuilder;
|
|
174
276
|
/**
|
|
175
277
|
* Set the cropping region of the image by defining the left edges, thereby displaying the specific part of the image you want.
|
|
176
|
-
* @param left
|
|
177
|
-
* @returns The
|
|
278
|
+
* @param {number} left - The number of pixels to crop from the left side of the image
|
|
279
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
178
280
|
* @example
|
|
179
281
|
* ```ts
|
|
180
|
-
* // create a new image builder.
|
|
181
|
-
*
|
|
182
|
-
* const
|
|
183
|
-
* const
|
|
184
|
-
* const
|
|
185
|
-
*
|
|
282
|
+
* // create a new image builder and set image source.
|
|
283
|
+
* // then build `ISheetImage` and insert it into the sheet, position is start from F6 cell, left crop is 10px.
|
|
284
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
285
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
286
|
+
* const image = await fWorksheet.newOverGridImage()
|
|
287
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
288
|
+
* .setColumn(5)
|
|
289
|
+
* .setRow(5)
|
|
290
|
+
* .setCropLeft(10)
|
|
291
|
+
* .buildAsync();
|
|
292
|
+
* fWorksheet.insertImages([image]);
|
|
186
293
|
* ```
|
|
187
294
|
*/
|
|
188
295
|
setCropLeft(left: number): FOverGridImageBuilder;
|
|
189
296
|
/**
|
|
190
297
|
* Set the cropping region of the image by defining the bottom edges, thereby displaying the specific part of the image you want.
|
|
191
|
-
* @param bottom
|
|
192
|
-
* @returns The
|
|
298
|
+
* @param {number} bottom - The number of pixels to crop from the bottom of the image
|
|
299
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
193
300
|
* @example
|
|
194
301
|
* ```ts
|
|
195
|
-
* // create a new image builder.
|
|
196
|
-
*
|
|
197
|
-
* const
|
|
198
|
-
* const
|
|
199
|
-
* const
|
|
200
|
-
*
|
|
302
|
+
* // create a new image builder and set image source.
|
|
303
|
+
* // then build `ISheetImage` and insert it into the sheet, position is start from F6 cell, bottom crop is 10px.
|
|
304
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
305
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
306
|
+
* const image = await fWorksheet.newOverGridImage()
|
|
307
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
308
|
+
* .setColumn(5)
|
|
309
|
+
* .setRow(5)
|
|
310
|
+
* .setCropBottom(10)
|
|
311
|
+
* .buildAsync();
|
|
312
|
+
* fWorksheet.insertImages([image]);
|
|
201
313
|
* ```
|
|
202
314
|
*/
|
|
203
315
|
setCropBottom(bottom: number): FOverGridImageBuilder;
|
|
204
316
|
/**
|
|
205
317
|
* Set the cropping region of the image by defining the right edges, thereby displaying the specific part of the image you want.
|
|
206
|
-
* @param right
|
|
207
|
-
* @returns The
|
|
318
|
+
* @param {number} right - The number of pixels to crop from the right side of the image
|
|
319
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
208
320
|
* @example
|
|
209
321
|
* ```ts
|
|
210
|
-
* // create a new image builder.
|
|
211
|
-
*
|
|
212
|
-
* const
|
|
213
|
-
* const
|
|
214
|
-
* const
|
|
215
|
-
*
|
|
322
|
+
* // create a new image builder and set image source.
|
|
323
|
+
* // then build `ISheetImage` and insert it into the sheet, position is start from F6 cell, right crop is 10px.
|
|
324
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
325
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
326
|
+
* const image = await fWorksheet.newOverGridImage()
|
|
327
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
328
|
+
* .setColumn(5)
|
|
329
|
+
* .setRow(5)
|
|
330
|
+
* .setCropRight(10)
|
|
331
|
+
* .buildAsync();
|
|
332
|
+
* fWorksheet.insertImages([image]);
|
|
216
333
|
* ```
|
|
217
334
|
*/
|
|
218
335
|
setCropRight(right: number): FOverGridImageBuilder;
|
|
219
336
|
private _initializeSrcRect;
|
|
220
337
|
/**
|
|
221
338
|
* Set the rotation angle of the image
|
|
222
|
-
* @param angle Degree of rotation of the image, for example, 90, 180, 270, etc.
|
|
223
|
-
* @returns The
|
|
339
|
+
* @param {number} angle - Degree of rotation of the image, for example, 90, 180, 270, etc.
|
|
340
|
+
* @returns {FOverGridImageBuilder} The `FOverGridImageBuilder` for chaining
|
|
224
341
|
* @example
|
|
225
342
|
* ```ts
|
|
226
|
-
* // create a new image builder.
|
|
227
|
-
*
|
|
228
|
-
* const
|
|
229
|
-
* const
|
|
230
|
-
* const
|
|
231
|
-
*
|
|
343
|
+
* // create a new image builder and set image source.
|
|
344
|
+
* // then build `ISheetImage` and insert it into the sheet, position is start from F6 cell, rotate 90 degrees.
|
|
345
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
346
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
347
|
+
* const image = await fWorksheet.newOverGridImage()
|
|
348
|
+
* .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
|
|
349
|
+
* .setColumn(5)
|
|
350
|
+
* .setRow(5)
|
|
351
|
+
* .setRotate(90)
|
|
352
|
+
* .buildAsync();
|
|
353
|
+
* fWorksheet.insertImages([image]);
|
|
232
354
|
* ```
|
|
233
355
|
*/
|
|
234
356
|
setRotate(angle: number): FOverGridImageBuilder;
|
|
@@ -244,143 +366,182 @@ export declare class FOverGridImage extends FBase {
|
|
|
244
366
|
protected readonly _commandService: ICommandService;
|
|
245
367
|
protected readonly _injector: Injector;
|
|
246
368
|
constructor(_image: ISheetImage, _commandService: ICommandService, _injector: Injector);
|
|
369
|
+
/**
|
|
370
|
+
* Get the id of the image
|
|
371
|
+
* @returns {string} The id of the image
|
|
372
|
+
* @example
|
|
373
|
+
* ```ts
|
|
374
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
375
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
376
|
+
* const images = fWorksheet.getImages();
|
|
377
|
+
* images.forEach((image) => {
|
|
378
|
+
* console.log(image, image.getId());
|
|
379
|
+
* });
|
|
380
|
+
* ```
|
|
381
|
+
*/
|
|
247
382
|
getId(): string;
|
|
383
|
+
/**
|
|
384
|
+
* Get the drawing type of the image
|
|
385
|
+
* @returns {DrawingTypeEnum} The drawing type of the image
|
|
386
|
+
* @example
|
|
387
|
+
* ```ts
|
|
388
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
389
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
390
|
+
* const images = fWorksheet.getImages();
|
|
391
|
+
* images.forEach((image) => {
|
|
392
|
+
* console.log(image, image.getType());
|
|
393
|
+
* });
|
|
394
|
+
* ```
|
|
395
|
+
*/
|
|
248
396
|
getType(): DrawingTypeEnum;
|
|
249
397
|
/**
|
|
250
398
|
* Remove the image from the sheet
|
|
251
|
-
* @returns
|
|
399
|
+
* @returns {boolean} true if the image is removed successfully, otherwise false
|
|
252
400
|
* @example
|
|
253
401
|
* ```ts
|
|
254
|
-
*
|
|
255
|
-
* const
|
|
256
|
-
* const
|
|
257
|
-
* const
|
|
258
|
-
* console.log(
|
|
402
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
403
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
404
|
+
* const image = fWorksheet.getImages()[0];
|
|
405
|
+
* const result = image?.remove();
|
|
406
|
+
* console.log(result);
|
|
259
407
|
* ```
|
|
260
408
|
*/
|
|
261
409
|
remove(): boolean;
|
|
262
410
|
/**
|
|
263
411
|
* Convert the image to a FOverGridImageBuilder
|
|
264
|
-
* @returns The builder FOverGridImageBuilder
|
|
412
|
+
* @returns {FOverGridImageBuilder} The builder FOverGridImageBuilder
|
|
265
413
|
* @example
|
|
266
414
|
* ```ts
|
|
267
|
-
*
|
|
268
|
-
* const
|
|
269
|
-
* const
|
|
270
|
-
*
|
|
271
|
-
*
|
|
272
|
-
*
|
|
273
|
-
* activeSheet.updateImages([param]);
|
|
415
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
416
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
417
|
+
* const images = fWorksheet.getImages();
|
|
418
|
+
* images.forEach((image) => {
|
|
419
|
+
* console.log(image, image.toBuilder().getSource());
|
|
420
|
+
* });
|
|
274
421
|
* ```
|
|
275
422
|
*/
|
|
276
423
|
toBuilder(): FOverGridImageBuilder;
|
|
277
424
|
/**
|
|
278
425
|
* Set the source of the image
|
|
279
|
-
* @param source The source of the image
|
|
280
|
-
* @returns
|
|
426
|
+
* @param {string} source - The source of the image
|
|
427
|
+
* @returns {boolean} true if the source is set successfully, otherwise false
|
|
281
428
|
* @example
|
|
282
429
|
* ```ts
|
|
283
|
-
*
|
|
284
|
-
* const
|
|
285
|
-
* const
|
|
286
|
-
* const
|
|
287
|
-
* console.log(
|
|
430
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
431
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
432
|
+
* const image = fWorksheet.getImages()[0];
|
|
433
|
+
* const result = image?.setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4');
|
|
434
|
+
* console.log(result);
|
|
435
|
+
* ```
|
|
288
436
|
*/
|
|
289
437
|
setSource(source: string): boolean;
|
|
290
438
|
/**
|
|
291
439
|
* Set the source of the image, change image display.
|
|
292
|
-
* @param source
|
|
293
|
-
* @param sourceType The source type of the image,
|
|
294
|
-
* @returns
|
|
440
|
+
* @param {string} source - The source of the image
|
|
441
|
+
* @param {ImageSourceType} [sourceType] - The source type of the image, default is URL
|
|
442
|
+
* @returns {boolean} true if the source is set successfully, otherwise false
|
|
443
|
+
* @example
|
|
444
|
+
* ```ts
|
|
445
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
446
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
447
|
+
* const image = fWorksheet.getImages()[0];
|
|
448
|
+
* const result = image?.setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL);
|
|
449
|
+
* console.log(result);
|
|
450
|
+
* ```
|
|
295
451
|
*/
|
|
296
452
|
setSource(source: string, sourceType?: ImageSourceType): boolean;
|
|
297
453
|
/**
|
|
298
454
|
* Set the position of the image
|
|
299
|
-
* @param row
|
|
300
|
-
* @param column The
|
|
301
|
-
* @returns
|
|
455
|
+
* @param {number} row - The row index of the image start position
|
|
456
|
+
* @param {number} column - The column index of the image start position
|
|
457
|
+
* @returns {boolean} true if the position is set successfully, otherwise false
|
|
302
458
|
* @example
|
|
303
459
|
* ```ts
|
|
304
|
-
*
|
|
305
|
-
* const
|
|
306
|
-
* const
|
|
307
|
-
* const image =
|
|
308
|
-
*
|
|
460
|
+
* // set the position of the image, the start position is F6 cell.
|
|
461
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
462
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
463
|
+
* const image = fWorksheet.getImages()[0];
|
|
464
|
+
* const result = image?.setPositionAsync(5, 5);
|
|
465
|
+
* console.log(result);
|
|
309
466
|
* ```
|
|
310
467
|
*/
|
|
311
468
|
setPositionAsync(row: number, column: number): Promise<boolean>;
|
|
312
469
|
/**
|
|
313
|
-
*
|
|
314
|
-
* @param column
|
|
315
|
-
* @param
|
|
316
|
-
* @param
|
|
317
|
-
* @
|
|
318
|
-
* @returns success or not
|
|
470
|
+
* @param {number} row - The row index of the image start position
|
|
471
|
+
* @param {number} column - The column index of the image start position
|
|
472
|
+
* @param {number} rowOffset - The row offset of the image start position, pixel unit
|
|
473
|
+
* @param {number} columnOffset - The column offset of the image start position, pixel unit
|
|
474
|
+
* @returns {boolean} true if the position is set successfully, otherwise false
|
|
319
475
|
* @example
|
|
320
476
|
* ```ts
|
|
321
|
-
* // set the position of the image
|
|
322
|
-
* const
|
|
323
|
-
* const
|
|
324
|
-
* const image =
|
|
325
|
-
*
|
|
477
|
+
* // set the position of the image, the start position is F6 cell, and the offset is 10px.
|
|
478
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
479
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
480
|
+
* const image = fWorksheet.getImages()[0];
|
|
481
|
+
* const result = image?.setPositionAsync(5, 5, 10, 10);
|
|
482
|
+
* console.log(result);
|
|
326
483
|
* ```
|
|
327
484
|
*/
|
|
328
485
|
setPositionAsync(row: number, column: number, rowOffset?: number, columnOffset?: number): Promise<boolean>;
|
|
329
486
|
/**
|
|
330
487
|
* Set the size of the image
|
|
331
|
-
* @param width
|
|
332
|
-
* @param height
|
|
333
|
-
* @returns
|
|
488
|
+
* @param {number} width - The width of the image, pixel unit
|
|
489
|
+
* @param {number} height - The height of the image, pixel unit
|
|
490
|
+
* @returns {boolean} true if the size is set successfully, otherwise false
|
|
334
491
|
* @example
|
|
335
492
|
* ```ts
|
|
336
|
-
* // set the
|
|
337
|
-
* const
|
|
338
|
-
* const
|
|
339
|
-
* const image =
|
|
340
|
-
*
|
|
493
|
+
* // set the image width 120px and height 50px
|
|
494
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
495
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
496
|
+
* const image = fWorksheet.getImages()[0];
|
|
497
|
+
* const result = image?.setSizeAsync(120, 50);
|
|
498
|
+
* console.log(result);
|
|
499
|
+
* ```
|
|
341
500
|
*/
|
|
342
501
|
setSizeAsync(width: number, height: number): Promise<boolean>;
|
|
343
502
|
/**
|
|
344
503
|
* Set the cropping region of the image by defining the top, bottom, left, and right edges, thereby displaying the specific part of the image you want.
|
|
345
|
-
* @param top
|
|
346
|
-
* @param left
|
|
347
|
-
* @param bottom
|
|
348
|
-
* @param right
|
|
349
|
-
* @returns
|
|
504
|
+
* @param {number} top - The number of pixels to crop from the top of the image
|
|
505
|
+
* @param {number} left - The number of pixels to crop from the left side of the image
|
|
506
|
+
* @param {number} bottom - The number of pixels to crop from the bottom of the image
|
|
507
|
+
* @param {number} right - The number of pixels to crop from the right side of the image
|
|
508
|
+
* @returns {boolean} true if the crop is set successfully, otherwise false
|
|
350
509
|
* @example
|
|
351
510
|
* ```ts
|
|
352
|
-
* // set the crop of the image
|
|
353
|
-
* const
|
|
354
|
-
* const
|
|
355
|
-
* const image =
|
|
356
|
-
*
|
|
511
|
+
* // set the crop of the image, top 10px, left 10px, bottom 10px, right 10px.
|
|
512
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
513
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
514
|
+
* const image = fWorksheet.getImages()[0];
|
|
515
|
+
* const result = image?.setCrop(10, 10, 10, 10);
|
|
516
|
+
* console.log(result);
|
|
357
517
|
* ```
|
|
358
518
|
*/
|
|
359
519
|
setCrop(top?: number, left?: number, bottom?: number, right?: number): boolean;
|
|
360
520
|
/**
|
|
361
521
|
* Set the rotation angle of the image
|
|
362
|
-
* @param angle Degree of rotation of the image, for example, 90, 180, 270, etc.
|
|
363
|
-
* @returns
|
|
522
|
+
* @param {number} angle - Degree of rotation of the image, for example, 90, 180, 270, etc.
|
|
523
|
+
* @returns {boolean} true if the rotation is set successfully, otherwise false
|
|
364
524
|
* @example
|
|
365
525
|
* ```ts
|
|
366
|
-
* // set
|
|
367
|
-
* const
|
|
368
|
-
* const
|
|
369
|
-
* const image =
|
|
370
|
-
*
|
|
526
|
+
* // set 90 degrees rotation of the image
|
|
527
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
528
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
529
|
+
* const image = fWorksheet.getImages()[0];
|
|
530
|
+
* const result = image?.setRotate(90);
|
|
531
|
+
* console.log(result);
|
|
371
532
|
* ```
|
|
372
533
|
*/
|
|
373
534
|
setRotate(angle: number): boolean;
|
|
374
535
|
/**
|
|
375
536
|
* Move the image layer forward by one level
|
|
376
|
-
* @returns
|
|
537
|
+
* @returns {boolean} true if the image is moved forward successfully, otherwise false
|
|
377
538
|
* @example
|
|
378
539
|
* ```ts
|
|
379
|
-
*
|
|
380
|
-
* const
|
|
381
|
-
* const
|
|
382
|
-
* const
|
|
383
|
-
* console.log(
|
|
540
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
541
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
542
|
+
* const image = fWorksheet.getImages()[0];
|
|
543
|
+
* const result = image?.setForward();
|
|
544
|
+
* console.log(result);
|
|
384
545
|
* ```
|
|
385
546
|
*/
|
|
386
547
|
setForward(): boolean;
|
|
@@ -389,37 +550,37 @@ export declare class FOverGridImage extends FBase {
|
|
|
389
550
|
* @returns success or not
|
|
390
551
|
* @example
|
|
391
552
|
* ```ts
|
|
392
|
-
*
|
|
393
|
-
* const
|
|
394
|
-
* const
|
|
395
|
-
* const
|
|
396
|
-
* console.log(
|
|
553
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
554
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
555
|
+
* const image = fWorksheet.getImages()[0];
|
|
556
|
+
* const result = image?.setBackward();
|
|
557
|
+
* console.log(result);
|
|
397
558
|
* ```
|
|
398
559
|
*/
|
|
399
560
|
setBackward(): boolean;
|
|
400
561
|
/**
|
|
401
|
-
* Move the image layer to the
|
|
562
|
+
* Move the image layer to the bottom layer
|
|
402
563
|
* @returns success or not
|
|
403
564
|
* @example
|
|
404
565
|
* ```ts
|
|
405
|
-
*
|
|
406
|
-
* const
|
|
407
|
-
* const
|
|
408
|
-
* const
|
|
409
|
-
* console.log(
|
|
566
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
567
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
568
|
+
* const image = fWorksheet.getImages()[0];
|
|
569
|
+
* const result = image?.setBack();
|
|
570
|
+
* console.log(result);
|
|
410
571
|
* ```
|
|
411
572
|
*/
|
|
412
573
|
setBack(): boolean;
|
|
413
574
|
/**
|
|
414
|
-
* Move the image layer to the
|
|
575
|
+
* Move the image layer to the top layer
|
|
415
576
|
* @returns success or not
|
|
416
577
|
* @example
|
|
417
578
|
* ```ts
|
|
418
|
-
*
|
|
419
|
-
* const
|
|
420
|
-
* const
|
|
421
|
-
* const
|
|
422
|
-
* console.log(
|
|
579
|
+
* const fWorkbook = univerAPI.getActiveWorkbook();
|
|
580
|
+
* const fWorksheet = fWorkbook.getActiveSheet();
|
|
581
|
+
* const image = fWorksheet.getImages()[0];
|
|
582
|
+
* const result = image?.setFront();
|
|
583
|
+
* console.log(result);
|
|
423
584
|
* ```
|
|
424
585
|
*/
|
|
425
586
|
setFront(): boolean;
|