Luckysheet is an MIT-licensed open source project with its ongoing development made possible entirely by the support of many awesome backers. If you'd like to join them, please consider:
## **<spanstyle="font-size:20px;">Q</span>** Is the remote loading data loadUrl or updateUrl?
**<spanstyle="font-size:20px;">A</span>**: [loadUrl](/zh/guide/config.html#loadurl). Configure loadUrl, Luckysheet will request the entire table data through ajax, and updateUrl will be used as the interface address for collaborative editing in real-time saving.
Note: Initial data needs to be configured with loadUrl and loadSheetUrl parameters, while for collaborative editing, in addition to the configuration of loadUrl and loadSheetUrl, updateUrl and allowUpdate must be configured to take effect.
+ {Function} [success]: callback function for the end of the operation
- **Explanation**:
Exit edit mode. After double-clicking the cell with the mouse, it will enter the cell editing mode. After the editing is completed, when the mouse clicks on the input box elsewhere to lose focus, the editing mode will be exited, and the value of the cell will be saved. This Api is the operation of automatically exiting the editing mode, mainly to trigger the automatic saving of cells.
- **Usage**:
- Manually trigger to exit edit mode
`luckysheet.exitEditMode()`
------------
## Row and column operations
### setHorizontalFrozen(isRange [,setting])
@ -1994,6 +2013,48 @@ Use note:
------------
### showGridLines([setting])
- **Parameter**:
- {PlainObject} [setting]: optional parameters
+ {Number} [order]: The subscript of the worksheet that needs to show the grid lines; the default value is the subscript of the current worksheet
+ {Function} [success]: callback function for the end of the operation
- **Explanation**:
Show the grid lines of the specified subscript worksheet, and return the worksheet object of the operation
- **Usage**:
- Show the grid lines of the current worksheet
`luckysheet.showGridLines()`
- Show the grid lines of the third worksheet
`luckysheet.showGridLines({order:2})`
------------
### hideGridLines([setting])
- **Parameter**:
- {PlainObject} [setting]: optional parameters
+ {Number} [order]: The subscript of the worksheet that needs to hdie the grid lines; the default value is the subscript of the current worksheet
+ {Function} [success]: callback function for the end of the operation
- **Explanation**:
Hide the grid lines of the specified subscript worksheet, and return the worksheet object of the operation
- **Usage**:
- Hide grid lines of current worksheet
`luckysheet.hideGridLines()`
- Hide the grid lines of the third worksheet
`luckysheet.hideGridLines({order:2})`
------------
## Workbook operations
### create(options [,setting])
@ -2136,7 +2197,23 @@ Use note:
------------
## chart
### refreshFormula([setting])
[todo]
- **Parameter**:
- {PlainObject} [setting]: optional parameters
+ {Object | String} [range]: Set the target selection range of the parameter. The supported selection format is `"A1:B2"`, `"sheetName!A1:B2"` or `{row:[0,1], column:[0,1]}`, allows an array of multiple selections; the default is the current selection ;The default is the entire current worksheet
+ {Function} [success]: callback function for the end of the operation
- **Explanation**:
Force refresh formula. When you directly modify the values of multiple cells without triggering a refresh, and these cells are associated with formulas, you can use this API to force a formula refresh to be triggered at the end. It is generally recommended to specify the affected cell range to prevent For performance issues, if you can't determine it, leave it blank to keep the entire worksheet traversed and refreshed.
`luckysheet` stores all operations in the history to `undo` and `redo`. If `allowupdate` is set to true and `updateURL` is available in initial, operations will be updated on the backend in real-time via webSocket. And every one can edit same sheet on the same time.
## Cell refresh
>Source code [`src/controllers/server.js`] (https://github.com/mengshukeji/Luckysheet/blob/master/src/controllers/server.js) The module shows us the function of background saving.
In general, shared editing(or collaborative editing) is controled by the account system created by developers to control permissions.
The following are all types of operations that support transferring to the background. In this case, I use mongodb as a storage example to explain how front-end and back-end interacts with eachother.
Pay attention, `i` in the object is the `index` of the sheet rather than `order`.
## Cell refresh
### single cell refresh
- **Format**:
```json
{
"t": "v",
"i": 3,
"v": "asdf",
"r": 5,
"c": 7
"i": "Sheet_0554kKiKl4M7_1597974810804",
"v": {
"v": 233,
"ct": { "fa": "General", "t": "n" },
"m": "233"
},
"r": 0,
"c": 1
}
```
@ -20,7 +32,7 @@
| ------------ | ------------ |
|t|Operation type symbol|
|i|The index value of the current sheet|
|v|Cell value|
|v|Cell value, refer to [单元格属性表](/zh/guide/cell.html#基本单元格)|
|r|Row number of cell|
|c|The column number of the cell|
@ -515,6 +527,43 @@
Delete the sheet whose index is the value corresponding to `deleIndex`.
### restore from a deleted sheet
- **format**:
```json
{
"t": "shre",
"i": null,
"v": {
"reIndex": "0"
}
}
```
- **Explanation**:
<table>
<tr>
<tdcolspan="2">Parameter</td>
<td>Explanation</td>
</tr>
<tr>
<tdcolspan="2">t</td>
<td>Operation type symbol</td>
</tr>
<tr>
<tdrowspan="2">v</td>
<td>deleIndex</td>
<td>需要恢复的sheet索引</td>
</tr>
</table>
- **Backend update**:
restore the sheet whose index is the number of `reIndex`.
### Position
- **Format**:
@ -522,8 +571,17 @@
```json
{
"t": "shr",
"i": null,
"v": {
"index": "positon"
"0": 1,
"1": 0,
"2": 2,
"3": 3,
"4": 4,
"5": 5,
"6": 6,
"7": 7,
"Sheet_6az6nei65t1i_1596209937084": 8
}
}
```
@ -543,6 +601,31 @@
`luckysheetfile[key2].order = value2`
`luckysheetfile[key3].order = value3`
### switch to the specified sheet
- **format**:
```json
{
"t": "shs",
"i": null,
"v": 1
}
```
- **Explanation**:
|Parameter|Explanation|
| ------------ | ------------ |
|t|Operation type symbol|
|v|index of the specified sheet|
- **Backend update**:
setting the `status` = `1`, when the `index` of a sheet is eaqul to `v`:
`luckysheetfile[v].status = 1`
## Sheet attributes (hide or show)
- **Format**:
@ -618,4 +701,188 @@
- **Backend update**:
According to gridkey, update the thumbnail field of the table in mysql to the img value, and update the status field of the sheet whose index is the curindex value to 1, and set the status value of other sheets to 0.
According to gridkey, update the thumbnail field of the table in mysql to the img value, and update the status field of the sheet whose index is the curindex value to 1, and set the status value of other sheets to 0.
## Chart(TODO)
There are four types of chart operations: add new chart -"add", move chart position-"xy", zoom chart-"wh", and update chart configuration-"update".
- usage: the zoom ratio of a sheet, which is a two decimal digit between 0~1, like `0.1`、`0.56`.
------------
### image
- type:Array
- default:[]
- usage: Insert the picture information in the table, including picture address, width and height, position, cropping and other information
- example:
The following is an example of `imageItem`, usually there may be multiple images in a worksheet, so the format of `image` is array `[imageItem,imageItem,...]`
```json
{
type: '3', //1 Move and resize the cell 2 Move and do not resize the cell 3 Don't move and resize the cell
src:'', //image url
originWidth: 1484, //The original width of the picture
originHeight: 834, //The original height of the picture
default: {
width: 293, //image width
height: 196, //image height
left: 409, //The position of the picture from the left of the table
top: 248, //The position of the picture from the top of the table
},
crop: {
width: 293, //The width of the picture after cropping
height: 196, //The height of the picture after cropping
offsetLeft: 0, //Displacement from the left of the picture after cropping
offsetTop: 0, //Displacement from the left of the picture after cropping
},
isFixedPos: false, //Fixed position
fixedLeft: 507, //Fixed position left displacement
fixedTop: 141, //fixed position right displacement
border: {
width: 0, //border width
radius: 0, //Border radius
style:'solid', //border type
color:'#000', //Border color
}
}
```
------------
### showGridLines
- Type: Number
- Default: 1
- Usage: Whether to show grid lines, `1` means show, `0` means hidden