转换操作

借助 GoogleSlides API,您可以操纵页面上 PageElement(文本框、图片、表格和基本形状)的位置、大小和方向,同时使线条保持笔直并保留点和平行线。这些转换称为仿射转换。此处的示例显示了使用 presentations.batchUpdate 方法的一些常见页面元素转换操作。

这些示例使用以下变量:

  • PRESENTATION_ID - 表示您提供演示文稿 ID 的位置。您可以从呈现网址中找到此 ID 的值。
  • PAGE_ID - 表示您提供页面对象 ID 的位置。您可以从网址或使用 API 读取请求检索此属性的值。
  • PAGE_ELEMENT_ID - 表示您提供页面元素对象 ID 的位置。您可以为自己创建的元素指定此 ID(存在某些限制),也可以允许 Slides API 自动创建一个 ID。您可以通过 API 读取请求检索元素 ID。

为了确保不考虑语言,这些示例以 HTTP 请求的形式呈现。如需了解如何使用 Google API 客户端库实现不同语言的批量更新,请参阅添加形状和文本

箭头形状示例

在下面的示例中,假设存在具有以下大小和变形数据(可通过 presentations.pages.get 方法请求找到)的示例箭头形状页面元素。示例形状使用测量单位 unit EMU(英制单位)和 pt(点)。

{
  "objectId": PAGE_ELEMENT_ID,
  "size": {
    "width": {
      "magnitude": 3000000,
      "unit": "EMU"
    },
    "height": {
      "magnitude": 3000000,
      "unit": "EMU"
    }
  },
  "transform": {
    "scaleX": 0.3,
    "scaleY": 0.12,
    "shearX": 0,
    "shearY": 0,
    "translateX": 2000000,
    "translateY":  550000,
    "unit": "EMU"
  },
  "shape": {
    "shapeType": "RIGHT_ARROW"
  }
}

将元素与其他元素对齐

以下 presentations.batchUpdate 代码示例展示了如何使用 CreateShapeRequest 方法在与页面上的示例箭头形状对齐的正确位置创建新形状。在这两种情况下,都必须计算新形状左上角的 X 和 Y 坐标。

第一个请求会创建一个 100x50 pt 的矩形,该矩形与箭头形状的左边框对齐,但位于箭头上边缘下方 50 pt (50 * 12,700 = 635,000 EMU)。新矩形的 X 坐标应与箭头的 X 坐标相同,以保持其左边框对齐。Y 坐标等于箭头的 Y 坐标加 50 pt,因为距离是从箭头的顶部测量的。因此,矩形的坐标为:

x" = 2000000 EMU
y" = 550000 + (50 * 12700) = 1185000 EMU

第二个请求会创建一个 40 pt 宽的圆圈,该圆的水平中心线与示例箭头相同,但位于箭头右侧边缘 100 pt (1,270,000 EMU) 处。圆形的 X 坐标为箭头 X 坐标、箭头宽度和 100 pt 的总和。如需强制新圆形与中心线对齐,需要考虑箭头和圆形的高度。圆形的 Y 坐标等于箭头的 Y 坐标加上箭头高度的一半减去圆形高度的一半。在这两种情况下,还必须考虑与箭头关联的缩放比例,因为它们会影响箭头的呈现宽度和高度。因此,圆形的坐标为:

x = 2000000 + (0.3 * 3000000) + (100 * 12700) = 4170000 EMU
y = 550000 + (0.5 * 0.12 * 3000000) - (0.5 * 40 * 12700) = 476000 EMU

以下是用于使一个元素与另一个元素对齐的请求协议:

POST https://slides.googleapis.com/v1/presentations/PRESENTATION_ID:batchUpdate
{
  "requests": [
    {
      "createShape": {
        "shapeType": "RECTANGLE",
        "elementProperties": {
          "pageObjectId": PAGE_ID,
          "size": {
            "width": {
              "magnitude": 100,
              "unit": "PT"
            },
            "height": {
              "magnitude": 50,
              "unit": "PT"
            }
          },
          "transform": {
            "scaleX": 1,
            "scaleY": 1,
            "translateX": 2000000,
            "translateY": 1185000,
            "unit": "EMU"
          }
        }
      }
    },
    {
      "createShape": {
        "shapeType": "ELLIPSE",
        "elementProperties": {
          "pageObjectId": PAGE_ID,
          "size": {
            "width": {
              "magnitude": 40,
              "unit": "PT"
            },
            "height": {
              "magnitude": 40,
              "unit": "PT"
            }
          },
          "transform": {
            "scaleX": 1,
            "scaleY": 1,
            "translateX": 4170000,
            "translateY":  476000,
            "unit": "EMU"
          }
        }
      }
    }
  ]
}

移动元素

以下 presentations.batchUpdate 代码示例展示了如何使用 UpdatePageElementTransformRequest 方法以两种不同的方式平移示例箭头形状页面元素。

批次中的第一个请求将箭头移动到 (X,Y) = (2000000, 150000) EMU 坐标(使用绝对平移 applyMode)。批量中的第二个请求将箭头从此处移动,这次 40, 000 EMU 向右移动,35,000 EMU 向上移动 35,000 EMU,避免了向上的 applyMode 转换。

执行这两个请求后,箭头的左上角会停在 (X,Y) = (2040000, 115000) EMU 坐标处。

以下是移动元素的请求协议:

POST https://slides.googleapis.com/v1/presentations/PRESENTATION_ID:batchUpdate
{
  "requests": [
    {
      "updatePageElementTransform": {
        "objectId": PAGE_ELEMENT_ID,
        "applyMode": "ABSOLUTE",
        "transform": {
            "scaleX": 0.3,
            "scaleY": 0.12,
            "translateX": 2000000,
            "translateY":  150000,
            "unit": "EMU"
        }
      }
    },
    {
      "updatePageElementTransform": {
        "objectId": PAGE_ELEMENT_ID,
        "applyMode": "RELATIVE",
        "transform": {
            "scaleX": 1,
            "scaleY": 1,
            "translateX":  40000,
            "translateY": -35000,
            "unit": "EMU"
        }
      }
    }
  ]
}

反射元素

以下 presentations.batchUpdate 代码示例展示了如何使用 UpdatePageElementTransformRequest 方法沿着示例箭头形状页面元素的中心水平方向反映该元素,同时不改变其在网页上的位置或进行缩放。

为此,您可以在元素的参考框中使用基本反射转换。为清楚起见,图中显示了对 UpdatePageElementTransformRequest 方法的三次单独调用来显示参考帧偏移和反射,但更为高效的做法是,预先计算这些转换矩阵的乘积,然后作为单个请求应用该乘积。

对于 translation 转换,箭头形状的中心会移向原点或从原点移动。为清楚起见,我们将参数值以计算形式表示。

以下是反映 元素的请求协议:

POST https://slides.googleapis.com/v1/presentations/PRESENTATION_ID:batchUpdate
{
  "requests": [
    {
      "updatePageElementTransform": {
        "objectId": PAGE_ELEMENT_ID,
        "applyMode": "RELATIVE",
        "transform": {
            "scaleX":  1,
            "scaleY":  1,
            "translateX": -2000000 - 0.5 * 0.3  * 3000000,
            "translateY":  -550000 - 0.5 * 0.12 * 3000000,
            "unit": "EMU"
        }
      }
    },
    {
      "updatePageElementTransform": {
        "objectId": PAGE_ELEMENT_ID,
        "applyMode": "RELATIVE",
        "transform": {
            "scaleX": -1,
            "scaleY":  1,
            "unit": "EMU"
        }
      }
    },
    {
      "updatePageElementTransform": {
        "objectId": PAGE_ELEMENT_ID,
        "applyMode": "RELATIVE",
        "transform": {
            "scaleX":  1,
            "scaleY":  1,
            "translateX":  2000000 + 0.5 * 0.3  * 3000000,
            "translateY":   550000 + 0.5 * 0.12 * 3000000,
            "unit": "EMU"
        }
      }
    }
  ]
}

调整元素大小

以下 presentations.batchUpdate 代码示例展示了如何使用 UpdatePageElementTransformRequest 方法将示例箭头形状页面元素放大 50%,使其宽度仅增加到当前高度的 80%,同时让箭头的中心保持同一位置并保持其方向。

为此,您可以在元素的参考框中使用基本缩放转换。为清楚起见,图中显示了对 UpdatePageElementTransformRequest 方法的三次单独调用来显示参考帧偏移和缩放,但更为高效的做法是,预先计算这些转换矩阵的乘积,然后作为单个请求应用该乘积。

对于 translation 转换,箭头形状的中心会移向原点或从原点移动。为清楚起见,我们将参数值以计算形式表示。

以下是调整元素大小的请求协议:

POST https://slides.googleapis.com/v1/presentations/PRESENTATION_ID:batchUpdate
{
  "requests": [
    {
      "updatePageElementTransform": {
          "objectId": PAGE_ELEMENT_ID,
          "applyMode": "RELATIVE",
          "transform": {
              "scaleX":  1,
              "scaleY":  1,
              "translateX": -2000000 - 0.5 * 0.3  * 3000000,
              "translateY":  -550000 - 0.5 * 0.12 * 3000000,
              "unit": "EMU"
          }
      }
    },
    {
      "updatePageElementTransform": {
        "objectId": PAGE_ELEMENT_ID,
        "applyMode": "RELATIVE",
        "transform": {
            "scaleX": 1.5,
            "scaleY": 0.8,
            "unit": "EMU"
        }
      }
    },
    {
      "updatePageElementTransform": {
        "objectId": PAGE_ELEMENT_ID,
        "applyMode": "RELATIVE",
        "transform": {
            "scaleX":  1,
            "scaleY":  1,
            "translateX":  2000000 + 0.5 * 0.3  * 3000000,
            "translateY":   550000 + 0.5 * 0.12 * 3000000,
            "unit": "EMU"
        }
      }
    }
  ]
}

围绕元素的中心旋转元素

以下 presentations.batchUpdate 代码示例展示了如何使用 UpdatePageElementTransformRequest 方法将示例箭头形状页面元素逆时针旋转 35 度,同时让箭头的中心保持相同的位置并保持其大小。

为此,您可以在元素的参考框中使用基本旋转转换。为清楚起见,图中显示了对 UpdatePageElementTransformRequest 方法的三次单独调用来显示参考帧偏移和旋转,但更高效的做法是,预先计算这些转换矩阵的乘积,然后将其作为单个请求应用

对于 translation 转换,箭头形状的中心会移向原点或从原点移动。为清楚起见,我们将参数值以计算形式表示。

以下是围绕元素中心旋转元素的请求协议:

POST https://slides.googleapis.com/v1/presentations/PRESENTATION_ID:batchUpdate
{
  "requests": [
    {
      "updatePageElementTransform": {
          "objectId": PAGE_ELEMENT_ID,
          "applyMode": "RELATIVE",
          "transform": {
              "scaleX":  1,
              "scaleY":  1,
              "translateX": -2000000 - 0.5 * 0.3  * 3000000,
              "translateY":  -550000 - 0.5 * 0.12 * 3000000,
              "unit": "EMU"
          }
      }
    },
    {
      "updatePageElementTransform": {
        "objectId": PAGE_ELEMENT_ID,
        "applyMode": "RELATIVE",
        "transform": {
            "scaleX":  cos(35 * (pi/180)),
            "scaleY":  cos(35 * (pi/180)),
            "shearX":  sin(35 * (pi/180)),
            "shearY": -sin(35 * (pi/180)),
            "unit": "EMU"
        }
      }
    },
    {
      "updatePageElementTransform": {
        "objectId": PAGE_ELEMENT_ID,
        "applyMode": "RELATIVE",
        "transform": {
            "scaleX":  1,
            "scaleY":  1,
            "translateX":  2000000 + 0.5 * 0.3  * 3000000,
            "translateY":   550000 + 0.5 * 0.12 * 3000000,
            "unit": "EMU"
        }
      }
    }
  ]
}