以下のリンク先のバリエーションです。
This article is a variation of the following link.
今回は、スプレッドシートの値をコピーしてスライドの表に入力するダイアログを表示します。
This time, create a dialog for copying values from a spreadsheet and pasting them into a table in a slide.
Procedures
スプレッドシートに4行3列の値を入力しておきます。（例ではA2:C5）
Prepare the values in the spreadsheet in 4 rows and 3 columns. (In the example, A2:C5)
入力した4行3列の値をコピーします。
Copy the entered 4x3 values.
下記Apps ScriptのCode.gsで modalessTemplate() を実行してダイアログを表示します。
Display the dialog by executing the modalessTemplate() function in the Code.gs Apps Script below.
コピーした値をテキストエリアに貼り付けます
Paste the copied values into the text area.
submitボタンをクリックすると、スライドの表に値が入力されます。
After clicking the submit button, the values are entered into the table in the slide.
Apps Script
Code.gs
function modalessTemplate() {
const htmlOutput = HtmlService
.createTemplateFromFile("index")
.evaluate()
.setWidth(720)
.setHeight(200);
SlidesApp.getUi().showModelessDialog(htmlOutput, "MyGUI");
}
function include(filename) {
return HtmlService.createHtmlOutputFromFile(filename).getContent();
}
function setValuesForTables(records) {
const arrays = createArrays(records);
const table = getSelectedTable();
setValuesInTable(table, arrays, 0, 1);
}
function getSelectedTable() {
const presentation = SlidesApp.getActivePresentation();
const selection = presentation.getSelection();
const pageElement = selection.getPageElementRange().getPageElements()[0];
const table = pageElement.asTable();
return table;
}
function createArrays(records) {
let arrays = [];
for(let i = 0; i < records.length; i++) {
const units = records[i].split("\t");
const values = [units[0], units[1] + "\n" + units[2]];
arrays.push(values);
}
return arrays;
}
function setValuesInTable(table, values, startRow = 0, startCol = 0) {
for (let row = 0; row < values.length; row++) {
for (let col = 0; col < values[row].length; col++) {
if (row + startRow < table.getNumRows() && col + startCol < table.getNumColumns()) {
table.getCell(row + startRow, col + startCol).getText().setText(values[row][col]);
}
}
}
}
index.html
<!DOCTYPE html>
<html>
<head>
<?!= include("css"); ?>
</head>
<body>
<textarea id="input"></textarea>
<br>
<button id="submit">submit</button>
<?!= include("javascript"); ?>
</body>
</html>
css.html
<style>
#input {
font-size: 12px;
width: 95vw;
height: 80vh;
}
</style>
javascript.html
<script>
function elem(id) {
return document.getElementById(id);
}
elem('input').addEventListener('keyup', inputKeyup);
elem('submit').addEventListener('click', submitClicked);
function inputKeyup() {
elem("input").value = elem("input").value.replace(/"/g, "");
}
function submitClicked() {
const records = elem("input").value.split("\n");
google.script.run.setValuesForTables(records);
}
</script>
Tips
スプレッドシートで改行を含むセルをコピーしてテキストエディタに貼り付けると、ダブルクォーテーション「"」で囲まれます。
When we copy a cell containing a newline from a spreadsheet and paste it into a text editor, it gets enclosed in double quotation marks (").
以下のコードで、値を貼り付けるときにダブルクォーテーションを削除しています。
The following code removes double quotes when pasting values.
elem("input").value = elem("input").value.replace(/"/g, "");
When we select and copy cells from a spreadsheet, the cells are separated by the tab character "\t", as shown below.
get\tTo obtain or receive something.\t何かを手に入れる、または受け取ること。
以下のコードでタブ文字の区切りで配列を作っています。
The following code creates an array by splitting a string at the tab characters.
const units = records[i].split("\t");
その後、1番目と2番目の要素を改行「\n」でつなげています。
After that, the elements at index 1 and index 2 are joined with a newline character "\n".
const values = [units[0], units[1] + "\n" + units[2]];
Reference
Google Slidesで現在選択している表に値を入れたい6 - Insert values into the active table6
