要素の操作

Slides API を使用すると、テキストボックス、画像、表、基本的なシェイプ、線、埋め込み動画など、さまざまなページ要素の作成および編集ができます。 このページでは、Slides API を使用して一般的なページ要素の操作を行うサンプルを紹介しています。

サンプルで使用する変数は次のとおりです。

テキストボックスに箇条書きリストを追加する

次の presentations.batchUpdate リクエストでは、pageElementId で指定された空のテキストボックスにテキストを挿入し、そのボックス内のテキストをすべて箇条書きリストに変換しています。リスト内の各アイテムは文字の \n で区切られ、インデントは文字の \t で制御されます。

リクエスト プロトコルは次のようになります。 テキストのスタイリング ガイドには、Google API クライアント ライブラリを使用してバッチ アップデートをさまざまな言語で実装する例が示されています。

POST https://slides.googleapis.com/v1/presentations/presentationId:batchUpdate
{
  "requests": [
    {
      "insertText": {
        "objectId": pageElementId,
        "text": "My List\n\tItem 1\n\t\tItem 2\n\t\t\tItem 3",
        "insertionIndex": 0
      },
      "createParagraphBullets": {
        "objectId": pageElementId,
        "bulletPreset": "BULLET_ARROW_DIAMOND_DISC",
        "textRange": {
          "type": "ALL"
        }
      }
    }
  ]
}

このリクエストによって、次のような箇条書きリストが表示されます。

箇条書きリストサンプルの表示結果

スライドにシェイプを追加する

以下の presentations.batchUpdate リクエストでは、pageId で指定されたスライドに波型のシェイプを追加しています。 このリクエストでは、シェイプのタイプとスケールを指定し、スライド上にシェイプを配置します。 そして 2 つ目のリクエストで、テキストをシェイプに追加します。 シェイプの ID は pageElementId に設定します。

リクエスト プロトコルは次のようになります。 テキストとシェイプの追加 ガイドには、Google API クライアント ライブラリを使用してバッチ アップデートをさまざまな言語で実装する例が示されています。

POST https://slides.googleapis.com/v1/presentations/presentationId:batchUpdate
{
  "requests": [
    {
      "createShape": {
        "objectId": pageElementId,
        "elementProperties": {
          "pageObjectId": pageId,
          "size": {
            "width": {
              "magnitude": 3000000,
              "unit": "EMU"
            },
            "height": {
              "magnitude": 3000000,
              "unit": "EMU"
            }
          },
          "transform": {
            "scaleX": 0.6807,
            "scaleY": 0.4585,
            "translateX": 6583050,
            "translateY": 1673950,
            "unit": "EMU"
          }
        },
        "shapeType": "WAVE"
      }
    },
    {
      "insertText": {
        "objectId": pageElementId,
        "text": "My Wave Shape",
        "insertionIndex": 0
      }
    }
  ]
}

スライドに動画を追加する

以下の presentations.batchUpdate リクエストでは、pageId で指定されたスライドに動画を埋め込んでいます。 このリクエストによって、スライド上で動画のスケーリングと配置が行われます。 動画の ID は pageElementId に設定します。 videoId は動画ソース固有の識別子です。たとえば URL が https://www.youtube.com/watch?v=7U3axjORYZ0 の YouTube 動画であれば、ID は 7U3axjORYZ0 になります。

リクエスト プロトコルは次のようになります。 テキストとシェイプの追加 ガイドには、Google API クライアント ライブラリを使用してバッチ アップデートをさまざまな言語で実装する例が示されています。

POST https://slides.googleapis.com/v1/presentations/presentationId:batchUpdate
{
  "requests": [
    {
      "createVideo": {
        "objectId": pageElementId,
        "elementProperties": {
          "pageObjectId": pageId,
          "size": {
            "width": {
              "magnitude": 12000,
              "unit": "EMU"
            },
            "height": {
              "magnitude": 9000,
              "unit": "EMU"
            }
          },
          "transform": {
            "scaleX": 381,
            "scaleY": 381,
            "translateX": 152400,
            "translateY": 152400,
            "unit": "EMU"
          }
        },
        "source": "YOUTUBE",
        "id": videoId
      }
    }
  ]
}

要素をコピーして編集する

以下の presentations.batchUpdate リクエストでは、シェイプ(pageElementId で指定)を取得して、そのコピー(copyElementId で指定)を作成します。その後、コピーを次のように変更します。

  • 背景色を LIGHT2 テーマ色に設定
  • コピー元のシェイプの位置よりもページの下方向にコピーを移動
  • テキスト フォントを 18 pt の Georgia に設定
  • テキストの内容を「My Shape Copy」に変更

この更新リクエストでは、フィールド マスクを使用して、変更対象ではないシェイプ プロパティ(枠線のスタイルなど)を保持しています。

リクエスト プロトコルは次のようになります。 テキストとシェイプの追加 ガイドには、Google API クライアント ライブラリを使用してバッチ アップデートをさまざまな言語で実装する例が示されています。

POST https://slides.googleapis.com/v1/presentations/presentationId:batchUpdate
{
  "requests": [
    {
      "duplicateObject": {
        "objectId": pageElementId,
        "objectIds": {
          pageElementId: copyElementId
        }
      }
    },
    {
      "updateShapeProperties": {
        "objectId": copyElementId,
        "fields": "shapeBackgroundFill.solidFill.color",
        "shapeProperties": {
          "shapeBackgroundFill": {
            "solidFill": {
              "color": {
                "themeColor": "LIGHT2"
              }
            }
          }
        }
      }
    },
    {
      "updatePageElementTransform": {
        "objectId": copyElementId,
        "applyMode": "RELATIVE",
        "transform": {
          "scaleX": 1,
          "scaleY": 1,
          "translateX": 0,
          "translateY": 1250000,
          "unit": "EMU"
        }
      }
    },
    {
      "updateTextStyle": {
        "objectId": copyElementId,
        "fields": "fontFamily,fontSize",
        "textRange": {
          "type": "ALL"
        },
        "style": {
          "fontFamily": "Georgia",
          "fontSize": {
            "magnitude": 18,
            "unit": "PT"
          }
        }
      }
    },
    {
      "deleteText": {
        "objectId": copyElementId,
        "textRange": {
          "type": "ALL"
        }
      }
    },
    {
      "insertText": {
        "objectId": copyElementId,
        "text": "My Shape Copy",
        "insertionIndex": 0
      }
    }
  ]
}

このリクエストによって、元のシェイプとそのコピーは次のように表示されます。

コピーと更新のサンプルの表示結果

画像と動画の枠線の編集

次の presentations.batchUpdate リクエストでは、imageElementId で指定された画像と、videoElementId で指定された動画の枠線の外観を変更しています。このリクエストの内容は次のとおりです。

  • 画像の枠線の色を半透過の ACCENT5 テーマ色に、動画の枠線の色を非透過の ACCENT1 テーマ色に設定
  • 枠線の太さを 3 pt に設定
  • 画像の枠線のスタイルを SOLID に、動画の枠線のスタイルを DASH_DOT に設定

現時点で updateImagePropertiesupdateVideoProperties のリクエストで変更可能な要素は、画像と動画の枠線のみです。その他のプロパティについては読み取り専用になります。将来的な API の変更に備えて、この更新リクエストではフィールド マスクを使用し、枠線だけが変更されるように指定しています。

リクエスト プロトコルは次のようになります。 テキストとシェイプの追加 ガイドには、Google API クライアント ライブラリを使用してバッチ アップデートをさまざまな言語で実装する例が示されています。

POST https://slides.googleapis.com/v1/presentations/presentationId:batchUpdate
{
  "requests": [
    {
      "updateImageProperties": {
        "objectId": imageElementId,
        "fields": "outline",
        "imageProperties": {
          "outline": {
            "dashStyle": "SOLID",
            "outlineFill": {
              "solidFill": {
                "alpha": 0.8,
                "color": {
                  "themeColor": "ACCENT5"
                }
              }
            },
            "weight": {
              "magnitude": 3,
              "unit": "PT"
            }
          }
        }
      }
    },
    {
      "updateVideoProperties": {
        "objectId": videoElementId,
        "fields": "outline",
        "videoProperties": {
          "outline": {
            "dashStyle": "DASH_DOT",
            "outlineFill": {
              "solidFill": {
                "alpha": 0.8,
                "color": {
                  "themeColor": "ACCENT1"
                }
              }
            },
            "weight": {
              "magnitude": 3,
              "unit": "PT"
            }
          }
        }
      }
    }
  ]
}

このリクエストによって、画像と埋め込み動画は次のように表示されます。

画像と動画の枠線のサンプルの表示結果

シェイプの枠線の変更

以下の presentations.batchUpdate リクエストでは、pageElementId で指定されたシェイプを取得して、その枠線の見た目を変更しています。このリクエストの内容は次のとおりです。

  • 枠線の色を半透明の ACCENT5 テーマ色に設定
  • 枠線の太さを 3 pt に設定
  • 枠線のスタイルを LONG_DASH に設定

この更新リクエストでは、フィールド マスクを使用して、変更対象ではないシェイプ プロパティ(シェイプの塗りつぶし色など)を保持しています。

リクエスト プロトコルは次のようになります。 テキストとシェイプの追加 ガイドには、Google API クライアント ライブラリを使用してバッチ アップデートをさまざまな言語で実装する例が示されています。

POST https://slides.googleapis.com/v1/presentations/presentationId:batchUpdate
{
  "requests": [
    {
      "updateShapeProperties": {
        "objectId": pageElementId,
        "fields": "outline",
        "shapeProperties": {
          "outline": {
            "dashStyle": "LONG_DASH",
            "outlineFill": {
              "solidFill": {
                "alpha": 0.6,
                "color": {
                  "themeColor": "ACCENT5"
                }
              }
            },
            "weight": {
              "magnitude": 3,
              "unit": "PT"
            }
          }
        }
      }
    }
  ]
}

このリクエストによって、シェイプは次のように表示されます。

枠線の更新サンプルの表示結果

シェイプやテキストボックス内のテキストの書式を設定する

以下の presentations.batchUpdate リクエストでは、pageElementId で指定されたシェイプを取得して、そのすべてのテキストの外観を変更しています。このリクエストの内容は次のとおりです。

  • テキストの色を ACCENT5 テーマ色に設定
  • フォントを太字、斜体、18 pt の Corsiva に設定
  • テキストに下線を表示

この更新リクエストでは、フィールド マスクを使用して、変更対象ではないテキスト スタイルのプロパティ(背景色、リンク、ベースラインのオフセットなど)を保持しています。

リクエスト プロトコルは次のようになります。 テキストとシェイプの追加 ガイドには、Google API クライアント ライブラリを使用してバッチ アップデートをさまざまな言語で実装する例が示されています。

POST https://slides.googleapis.com/v1/presentations/presentationId:batchUpdate
{
  "requests": [
    {
      "updateTextStyle": {
        "objectId": pageElementId,
        "fields": "foregroundColor,bold,italic,fontFamily,fontSize,underline",
        "style": {
          "foregroundColor": {
            "opaqueColor": {
              "themeColor": "ACCENT5"
            }
          },
          "bold": true,
          "italic": true,
          "underline": true,
          "fontFamily": "Corsiva",
          "fontSize": {
            "magnitude": 18,
            "unit": "PT"
          }
        },
        "textRange": {
          "type": "ALL"
        }
      }
    }
  ]
}

このリクエストによって、シェイプ テキストは次のように表示されます。

テキストの書式変更サンプルの表示結果

スプレッドシートからグラフをインポートする

以下の presentations.batchUpdate リクエストでは、Google スプレッドシートからグラフをインポートして、それを pageId で指定されたスライド上に配置しています。このリクエストを行うには、スプレッドシート ID とスプレッドシート グラフ ID が必要です。 ここで指定している値は、それぞれ spreadsheetIdspreadsheetChartId です。 スライド内のグラフの ID は presentationChartId になります。 また、このリクエストではスライドのグラフを LINKED として設定するため、スプレッドシートのグラフの更新時にはスライドのグラフも簡単に更新できます。

リクエスト プロトコルは次のようになります。 グラフの追加のガイドには、Google API クライアント ライブラリを使用してバッチ アップデートをさまざまな言語で実装する例が示されています。

POST https://slides.googleapis.com/v1/presentations/presentationId:batchUpdate
{
  "requests": [
    {
      "createSheetsChart": {
        "objectId": presentationChartId,
        "spreadsheetId": spreadsheetId,
        "chartId": spreadsheetChartId,
        "linkingMode": "LINKED",
        "elementProperties": {
          "pageObjectId": pageId,
          "size": {
            "width": {
              "magnitude": 4000000,
              "unit": "EMU"
            },
            "height": {
              "magnitude": 4000000,
              "unit": "EMU"
            }
          },
          "transform": {
            "scaleX": 1,
            "scaleY": 1,
            "translateX": 100000,
            "translateY": 100000,
            "unit": "EMU"
          }
      }
    }
  ]
}

スプレッドシート上のデータでグラフを更新する

以下の presentations.batchUpdate リクエストでは、プレゼンテーション内のリンク付きグラフを更新し、それを Google スプレッドシート上にある最新版のグラフで置き換えます。このリクエストを行うには、プレゼンテーションに含まれるグラフの ID(presentationChartId)が必要です。

リクエスト プロトコルは次のようになります。 グラフの追加のガイドには、Google API クライアント ライブラリを使用してバッチ アップデートをさまざまな言語で実装する例が示されています。

POST https://slides.googleapis.com/v1/presentations/presentationId:batchUpdate
{
  "requests": [
    {
      "refreshSheetsChart": {
        "objectId": presentationChartId
      }
    }
  ]
}

フィードバックを送信...

ご不明な点がありましたら、Google のサポートページをご覧ください。