Skip to content

Commit 43d8302

Browse files
committed
docs: supplement hyperlink docs
1 parent 74c7371 commit 43d8302

4 files changed

Lines changed: 282 additions & 174 deletions

File tree

content/guides/sheets/features/hyper-link.ja-JP.mdx

Lines changed: 71 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -138,62 +138,89 @@ univer.registerPlugin(UniverSheetsHyperLinkUIPlugin, {
138138
import '@univerjs/sheets-hyper-link/facade'
139139
```
140140

141-
### ハイパーリンクの生成・解析・ジャンプ
141+
`navigateToSheetHyperlink` API は UI プラグインに含まれるため、次をインポートしてください:
142142

143143
```typescript
144-
const fWorkbook = univerAPI.getActiveWorkbook()
145-
const sheets = fWorkbook.getSheets()
144+
import '@univerjs/sheets-hyper-link-ui/facade'
145+
```
146146

147-
// 最初のシートのセル F6 へのハイパーリンクを作成します
148-
const sheet1 = sheets[0]
149-
const range = sheet1.getRange('F6')
150-
const hyperlink = range.getUrl()
147+
### ハイパーリンクの作成
151148

152-
// ハイパーリンクを解析します
153-
const hyperlinkInfo = fWorkbook.parseSheetHyperlink(hyperlink)
149+
```typescript
150+
const fWorkbook = univerAPI.getActiveWorkbook()
151+
const fWorksheet = fWorkbook.getSheetByName('Sheet1')
152+
if (!fWorksheet) return
154153

155-
// 2 番目のシートに切り替えます
156-
fWorkbook.setActiveSheet(sheets[1])
157-
fWorkbook.getActiveSheet().getSheetName()
154+
// セル A1 に Univer へのハイパーリンクを作成します
155+
const fRange = fWorksheet.getRange('A1')
156+
await fRange.setHyperLink('https://univer.ai/', 'Univer')
157+
158+
// セル A2 に Sheet1 の範囲 B2:D4 へのハイパーリンクを作成します
159+
const fRange2 = fWorksheet.getRange('A2')
160+
const rangeUrl = fWorksheet.getRange('B2:D4').getUrl()
161+
await fRange2.setHyperLink(rangeUrl, 'Link to B2:D4')
162+
163+
// セル A3 に別のシート範囲へのハイパーリンクを作成します
164+
const anotherSheet = fWorkbook.getSheetByName('Another Sheet')
165+
if (anotherSheet) {
166+
const fRange3 = fWorksheet.getRange('A3')
167+
const anotherSheetUrl = anotherSheet.getUrl()
168+
await fRange3.setHyperLink(anotherSheetUrl, 'Link to Another Sheet')
169+
}
170+
171+
// セル A4 に定義名へのハイパーリンクを作成します
172+
const fRange4 = fWorksheet.getRange('A4')
173+
const definedNameHyperlinkUrl = fWorkbook.getUrlOfDefineName('MyDefinedName')
174+
await fRange4.setHyperLink(definedNameHyperlinkUrl, 'Link to MyDefinedName')
175+
```
158176

159-
// 3 秒後にハイパーリンクへ移動します
160-
setTimeout(() => {
161-
fWorkbook.navigateToSheetHyperlink(hyperlink)
162-
fWorkbook.getActiveSheet().getSheetName()
163-
}, 3000)
177+
### ハイパーリンクの取得・更新・解除
178+
179+
```typescript
180+
const fWorkbook = univerAPI.getActiveWorkbook()
181+
const fWorksheet = fWorkbook.getSheetByName('Sheet1')
182+
if (!fWorksheet) return
183+
184+
// 範囲 A1:D10 内のすべてのハイパーリンクを取得します
185+
const fRange = fWorksheet.getRange('A1:D10')
186+
const hyperlinks = fRange.getHyperLinks()
187+
console.log(hyperlinks)
188+
189+
// セル A1 のハイパーリンクを更新します
190+
const cellA1 = fWorksheet.getRange('A1')
191+
const rangeUrl = fWorksheet.getRange('B2:D4').getUrl()
192+
await cellA1.updateHyperLink(rangeUrl, 'Link to B2:D4')
193+
194+
// 範囲 A1:D10 内のすべてのハイパーリンクを解除します
195+
fRange.cancelHyperLink()
196+
197+
// または、範囲 A1:D10 内の特定のハイパーリンクを解除します
198+
if (hyperlinks.length > 1) {
199+
fRange.cancelHyperLink(hyperlinks[1])
200+
}
164201
```
165202

166-
### セル内ハイパーリンクの操作
203+
### ハイパーリンクの構築・解析・ジャンプ
167204

168205
```typescript
169206
const fWorkbook = univerAPI.getActiveWorkbook()
170-
const fWorksheet = fWorkbook.getActiveSheet()
207+
const sheets = fWorkbook.getSheets()
171208

172-
// セル A1 に Univer へのハイパーリンクを作成します
173-
const fRange = fWorksheet.getRange('A1')
174-
const richText = univerAPI.newRichText().insertLink('Univer', 'https://univer.ai/')
175-
fRange.setRichTextValueForCell(richText)
176-
177-
// 現在のセル内のハイパーリンクを取得します
178-
const cellValue = fRange.getValue(true)
179-
const hyperlinks = cellValue.getLinks()
180-
181-
// 3 秒後にハイパーリンクを更新します
182-
setTimeout(() => {
183-
const id = hyperlinks[0].rangeId
184-
const newUrl = 'https://insight.univer.ai/'
185-
const newRichText = cellValue.copy().updateLink(id, newUrl)
186-
fRange.setRichTextValueForCell(newRichText)
187-
}, 3000)
188-
189-
// 6 秒後にハイパーリンクを解除します
190-
setTimeout(() => {
191-
const newCellValue = fRange.getValue(true)
192-
const newHyperlinks = newCellValue.getLinks()
193-
const id = newHyperlinks[0].rangeId
194-
const newRichText = newCellValue.copy().cancelLink(id)
195-
fRange.setRichTextValueForCell(newRichText)
196-
}, 6000)
209+
// 最初のシートのセル F6 を指すハイパーリンク URL を構築します
210+
const hyperlinkUrl = sheets[0].getRange('F6').getUrl()
211+
212+
// ハイパーリンクを解析します
213+
const hyperlinkInfo = fWorkbook.parseSheetHyperlink(hyperlinkUrl)
214+
console.log(hyperlinkInfo)
215+
216+
// 2 番目のシートに切り替えます
217+
fWorkbook.setActiveSheet(sheets[1])
218+
console.log(fWorkbook.getActiveSheet().getSheetName())
219+
220+
// 3 秒後にハイパーリンクへ移動します
221+
await new Promise(resolve => setTimeout(resolve, 3000))
222+
fWorkbook.navigateToSheetHyperlink(hyperlinkUrl)
223+
console.log(fWorkbook.getActiveSheet().getSheetName())
197224
```
198225

199226
### Event Listeners

content/guides/sheets/features/hyper-link.mdx

Lines changed: 71 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -138,62 +138,89 @@ Complete Facade API type definitions can be found in the [FacadeAPI](https://ref
138138
import '@univerjs/sheets-hyper-link/facade'
139139
```
140140

141-
### Build/Parse/Jump HyperLink
141+
The `navigateToSheetHyperlink` API is provided by the UI plugin, so import:
142142

143143
```typescript
144-
const fWorkbook = univerAPI.getActiveWorkbook()
145-
const sheets = fWorkbook.getSheets()
144+
import '@univerjs/sheets-hyper-link-ui/facade'
145+
```
146146

147-
// Create a hyperlink to the cell F6 in the first sheet
148-
const sheet1 = sheets[0]
149-
const range = sheet1.getRange('F6')
150-
const hyperlink = range.getUrl()
147+
### Create HyperLink
151148

152-
// Parse the hyperlink
153-
const hyperlinkInfo = fWorkbook.parseSheetHyperlink(hyperlink)
149+
```typescript
150+
const fWorkbook = univerAPI.getActiveWorkbook()
151+
const fWorksheet = fWorkbook.getSheetByName('Sheet1')
152+
if (!fWorksheet) return
154153

155-
// Switch to the second sheet
156-
fWorkbook.setActiveSheet(sheets[1])
157-
fWorkbook.getActiveSheet().getSheetName()
154+
// Create a hyperlink to Univer on cell A1
155+
const fRange = fWorksheet.getRange('A1')
156+
await fRange.setHyperLink('https://univer.ai/', 'Univer')
157+
158+
// Create a hyperlink to active sheet range B2:D4 on cell A2
159+
const fRange2 = fWorksheet.getRange('A2')
160+
const rangeUrl = fWorksheet.getRange('B2:D4').getUrl()
161+
await fRange2.setHyperLink(rangeUrl, 'Link to B2:D4')
162+
163+
// Create a hyperlink to another sheet range on cell A3
164+
const anotherSheet = fWorkbook.getSheetByName('Another Sheet')
165+
if (anotherSheet) {
166+
const fRange3 = fWorksheet.getRange('A3')
167+
const anotherSheetUrl = anotherSheet.getUrl()
168+
await fRange3.setHyperLink(anotherSheetUrl, 'Link to Another Sheet')
169+
}
170+
171+
// Create a hyperlink to a defined name on cell A4
172+
const fRange4 = fWorksheet.getRange('A4')
173+
const definedNameHyperlinkUrl = fWorkbook.getUrlOfDefineName('MyDefinedName')
174+
await fRange4.setHyperLink(definedNameHyperlinkUrl, 'Link to MyDefinedName')
175+
```
176+
177+
### Get/Update/Cancel HyperLink
158178

159-
// Navigate to the hyperlink after 3 seconds
160-
setTimeout(() => {
161-
fWorkbook.navigateToSheetHyperlink(hyperlink)
162-
fWorkbook.getActiveSheet().getSheetName()
163-
}, 3000)
179+
```typescript
180+
const fWorkbook = univerAPI.getActiveWorkbook()
181+
const fWorksheet = fWorkbook.getSheetByName('Sheet1')
182+
if (!fWorksheet) return
183+
184+
// Get all hyperlinks in the range A1:D10
185+
const fRange = fWorksheet.getRange('A1:D10')
186+
const hyperlinks = fRange.getHyperLinks()
187+
console.log(hyperlinks)
188+
189+
// Update the hyperlink on cell A1
190+
const cellA1 = fWorksheet.getRange('A1')
191+
const rangeUrl = fWorksheet.getRange('B2:D4').getUrl()
192+
await cellA1.updateHyperLink(rangeUrl, 'Link to B2:D4')
193+
194+
// Clear all hyperlinks in the range A1:D10
195+
fRange.cancelHyperLink()
196+
197+
// Or clear a specific hyperlink in the range A1:D10
198+
if (hyperlinks.length > 1) {
199+
fRange.cancelHyperLink(hyperlinks[1])
200+
}
164201
```
165202

166-
### Manipulating Hyperlinks in Cells
203+
### Build/Parse/Jump HyperLink
167204

168205
```typescript
169206
const fWorkbook = univerAPI.getActiveWorkbook()
170-
const fWorksheet = fWorkbook.getActiveSheet()
207+
const sheets = fWorkbook.getSheets()
171208

172-
// Create a hyperlink to Univer on cell A1
173-
const fRange = fWorksheet.getRange('A1')
174-
const richText = univerAPI.newRichText().insertLink('Univer', 'https://univer.ai/')
175-
fRange.setRichTextValueForCell(richText)
176-
177-
// Query the hyperlinks in the current cell
178-
const cellValue = fRange.getValue(true)
179-
const hyperlinks = cellValue.getLinks()
180-
181-
// Update hyperlink after 3 seconds
182-
setTimeout(() => {
183-
const id = hyperlinks[0].rangeId
184-
const newUrl = 'https://insight.univer.ai/'
185-
const newRichText = cellValue.copy().updateLink(id, newUrl)
186-
fRange.setRichTextValueForCell(newRichText)
187-
}, 3000)
188-
189-
// Cancel hyperlink after 6 seconds
190-
setTimeout(() => {
191-
const newCellValue = fRange.getValue(true)
192-
const newHyperlinks = newCellValue.getLinks()
193-
const id = newHyperlinks[0].rangeId
194-
const newRichText = newCellValue.copy().cancelLink(id)
195-
fRange.setRichTextValueForCell(newRichText)
196-
}, 6000)
209+
// Build a hyperlink url pointing to cell F6 of the first sheet
210+
const hyperlinkUrl = sheets[0].getRange('F6').getUrl()
211+
212+
// Parse the hyperlink
213+
const hyperlinkInfo = fWorkbook.parseSheetHyperlink(hyperlinkUrl)
214+
console.log(hyperlinkInfo)
215+
216+
// Switch to the second sheet
217+
fWorkbook.setActiveSheet(sheets[1])
218+
console.log(fWorkbook.getActiveSheet().getSheetName())
219+
220+
// Jump to the hyperlink after 3 seconds
221+
await new Promise(resolve => setTimeout(resolve, 3000))
222+
fWorkbook.navigateToSheetHyperlink(hyperlinkUrl)
223+
console.log(fWorkbook.getActiveSheet().getSheetName())
197224
```
198225

199226
### Event Listeners

0 commit comments

Comments
 (0)