การดําเนินการในตาราง

API ของ Google สไลด์ช่วยให้คุณสร้างและแก้ไขตารางในหน้าต่างๆ ได้ ตัวอย่างในหน้านี้แสดงการดำเนินการของตารางทั่วไปโดยใช้เมธอด presentations.batchUpdate

ตัวอย่างเหล่านี้ใช้ตัวแปรต่อไปนี้

• PRESENTATION_ID - ระบุตำแหน่งที่คุณให้รหัสงานนำเสนอ คุณดูค่าสำหรับรหัสนี้ได้จาก URL ของงานนำเสนอ
• PAGE_ID - ระบุตำแหน่งที่คุณระบุรหัสออบเจ็กต์หน้าเว็บ คุณดึงค่าสำหรับค่านี้จาก URL หรือโดยใช้คำขออ่าน API ก็ได้
• TABLE_ID - ระบุตำแหน่งที่คุณใส่รหัสออบเจ็กต์องค์ประกอบหน้าเว็บของตารางที่คุณกำลังทำงานด้วย คุณสามารถระบุรหัสนี้สำหรับองค์ประกอบที่คุณสร้าง (โดยมีข้อจำกัดบางประการ) หรืออนุญาตให้ Slides API สร้างรหัสดังกล่าวโดยอัตโนมัติ คุณจะดึงข้อมูลรหัสองค์ประกอบได้ผ่านคำขออ่าน API

ตัวอย่างเหล่านี้จะแสดงเป็นคำขอ HTTP ให้ใช้ภาษาเป็นกลาง หากต้องการดูวิธีใช้การอัปเดตเป็นกลุ่มในภาษาต่างๆ โดยใช้ไลบรารีของไคลเอ็นต์ Google API โปรดดูเพิ่มรูปร่างและข้อความ

สร้างตาราง

ตัวอย่างโค้ด presentations.batchUpdate ต่อไปนี้จะแสดงวิธีใช้ CreateTableRequest เพื่อเพิ่มตารางลงในสไลด์ที่ PAGE_ID ระบุไว้

ตารางนี้มี 8 แถวและ 5 คอลัมน์ โปรดทราบว่า Slides API จะไม่สนใจช่อง size หรือ transform ใดๆ ที่จัดเตรียมไว้เป็นส่วนหนึ่งของelementProperties แต่ API จะสร้างตารางที่มีกึ่งกลางของสไลด์โดยประมาณและปรับขนาดให้รองรับจำนวนแถวและคอลัมน์ที่ระบุ หากเป็นไปได้

โปรโตคอลคำขอสร้างตารางมีดังนี้

POST https://slides.googleapis.com/v1/presentations/PRESENTATION_ID:batchUpdate

{
  "requests": [
    {
      "createTable": {
        "objectId": TABLE_ID,
        "elementProperties": {
          "pageObjectId": PAGE_ID,
        },
        "rows": 8,
        "columns": 5
      }
    }
  ]
}

ลบแถวหรือคอลัมน์ของตาราง

ตัวอย่างโค้ด presentations.batchUpdate ต่อไปนี้จะแสดงวิธีใช้เมธอด DeleteTableRowRequest ในการนำแถวที่ 6 ออก จากนั้นจะใช้เมธอด DeleteTableColumnRequest เพื่อนำคอลัมน์ที่ 4 ออก ตารางนี้กําหนดโดย TABLE_ID ทั้ง rowIndex และ columnIndex ภายใน cellLocation ไม่อิงกับค่า 0

โปรโตคอลคำขอลบแถวหรือคอลัมน์ในตารางมีดังนี้

POST https://slides.googleapis.com/v1/presentations/PRESENTATION_ID:batchUpdate

{
  "requests": [
    {
      "deleteTableRow": {
        "tableObjectId": TABLE_ID,
        "cellLocation": {
          "rowIndex": 5
        }
      }
    },
    {
      "deleteTableColumn": {
        "tableObjectId": TABLE_ID,
        "cellLocation": {
          "columnIndex": 3
        }
      }
    }
  ]
}

แก้ไขข้อมูลตาราง

ตัวอย่างโค้ด presentations.batchUpdate ต่อไปนี้จะแสดงวิธีใช้เมธอด DeleteTextRequest เพื่อนำข้อความทั้งหมดในเซลล์ออกภายใน textRange จากนั้นจะใช้เมธอด InsertTextRequest เพื่อแทนที่ด้วยข้อความใหม่ของ "Kangaroo"

ตารางนี้กําหนดโดย TABLE_ID เซลล์ที่ได้รับผลกระทบจะอยู่ใน แถวที่ 5 และคอลัมน์ที่ 3 ทั้ง rowIndex และ columnIndex ภายใน cellLocation ไม่อิงค่า 0

ต่อไปนี้คือโปรโตคอลคำขอเพื่อแก้ไขข้อมูลในตาราง

POST https://slides.googleapis.com/v1/presentations/PRESENTATION_ID:batchUpdate

{
  "requests": [
    {
      "deleteText": {
        "objectId": TABLE_ID,
        "cellLocation": {
          "rowIndex": 4,
          "columnIndex": 2
        },
        "textRange": {
          "type": "ALL",
        }
      }
    },
    {
      "insertText": {
        "objectId": TABLE_ID,
        "cellLocation": {
          "rowIndex": 4,
          "columnIndex": 2
        },
        "text": "Kangaroo",
        "insertionIndex": 0
      }
    }
  ]
}

จัดรูปแบบแถวส่วนหัวของตาราง

ตัวอย่างโค้ด presentations.batchUpdate ต่อไปนี้จะแสดงวิธีใช้เมธอด UpdateTableCellPropertiesRequest เพื่อจัดรูปแบบแถวส่วนหัวขององค์ประกอบตารางภายใน tableRange ซึ่งระบุโดย TABLE_ID จากนั้นจะใช้เมธอด TableCellProperties เพื่อตั้งค่าสีพื้นหลังของแถวส่วนหัวเป็นสีดำ

คำขอแต่ละรายการต่อไปนี้จะใช้เมธอด UpdateTextStyleRequest เพื่อตั้งค่ารูปแบบข้อความในเซลล์ใดเซลล์หนึ่งของแถวส่วนหัวให้เป็นแบบอักษร Cambria สีขาวขนาด 18 คะแนนเป็นตัวหนาภายในtextRange จากนั้นคุณต้องส่งคำขอนี้ซ้ำสำหรับแต่ละเซลล์เพิ่มเติมในส่วนหัว

ทั้ง rowIndex และ columnIndex ภายใน location และ cellLocation ไม่อิงตาม 0

ต่อไปนี้เป็นโปรโตคอลคำขอในการจัดรูปแบบแถวส่วนหัวของตาราง

POST https://slides.googleapis.com/v1/presentations/PRESENTATION_ID:batchUpdate

{
  "requests": [
    {
      "updateTableCellProperties": {
        "objectId": TABLE_ID,
        "tableRange": {
          "location": {
            "rowIndex": 0,
            "columnIndex": 0
          },
          "rowSpan": 1,
          "columnSpan": 3
        },
        "tableCellProperties": {
          "tableCellBackgroundFill": {
            "solidFill": {
              "color": {
                "rgbColor": {
                  "red": 0.0,
                  "green": 0.0,
                  "blue": 0.0
                }
              }
            }
          }
        },
        "fields": "tableCellBackgroundFill.solidFill.color"
      }
    },
    {
      "updateTextStyle": {
        "objectId": TABLE_ID,
        "cellLocation": {
          "rowIndex": 0,
          "columnIndex": 0
        },
        "style": {
          "foregroundColor": {
            "opaqueColor": {
              "rgbColor": {
                "red": 1.0,
                "green": 1.0,
                "blue": 1.0
              }
            }
          },
          "bold": true,
          "fontFamily": "Cambria",
          "fontSize": {
            "magnitude": 18,
            "unit": "PT"
          }
        },
        "textRange": {
          "type": "ALL"
        },
        "fields": "foregroundColor,bold,fontFamily,fontSize"
      }
    },
    // Repeat the above request for each additional cell in the header row....
  ]
}

แถวส่วนหัวที่จัดรูปแบบจะมีลักษณะดังนี้หลังจากการอัปเดต

แทรกแถวหรือคอลัมน์ในตาราง

ตัวอย่างโค้ด presentations.batchUpdate ต่อไปนี้จะแสดงวิธีใช้เมธอด InsertTableRowsRequest เพื่อเพิ่มแถว 3 แถวที่อยู่ใต้แถวที่ 6 จากนั้นใช้วิธีการ InsertTableColumnsRequest เพื่อเพิ่ม 2 คอลัมน์ทางด้านซ้ายของคอลัมน์ที่ 4 ในตารางเดียวกัน

ตารางนี้กําหนดโดย TABLE_ID ทั้ง rowIndex และ columnIndex ภายใน cellLocation ไม่อิงกับค่า 0

โปรโตคอลคำขอแทรกแถวหรือคอลัมน์ในตารางมีดังนี้

POST https://slides.googleapis.com/v1/presentations/PRESENTATION_ID:batchUpdate

{
  "requests": [
    {
      "insertTableRows": {
        "tableObjectId": TABLE_ID,
        "cellLocation": {
          "rowIndex": 5
        },
        "insertBelow": true,
        "number": 3
      }
    },
    {
      "insertTableColumns": {
        "tableObjectId": TABLE_ID,
        "cellLocation": {
          "columnIndex": 3
        },
        "insertRight": false,
        "number": 2
      }
    }
  ]
}