변환 작업

Google Slides API를 사용하면 선을 직선으로 유지하고 점과 평행선을 보존하면서 페이지에서 PageElement (텍스트 상자, 이미지, 표, 기본 도형)의 위치, 크기, 방향을 조작할 수 있습니다. 이를 아핀 변환 이라고 합니다. 여기 예에서는 일반적인 페이지 요소 변환 작업을 사용하여 presentations.batchUpdate 메서드를 보여줍니다.

이 예시에서는 다음 변수가 사용됩니다.

이러한 예는 언어 중립적인 HTTP 요청으로 제공됩니다. Google API 클라이언트 라이브러리를 사용하여 여러 언어로 일괄 업데이트를 구현하는 방법을 알아보려면 도형 및 텍스트 추가를 참고하세요.

화살표 도형 예

아래 예에서는 다음 크기 및 변환 데이터가 있는 화살표 도형 페이지 요소가 있다고 가정합니다 (presentations.pages.get 메서드 요청으로 찾을 수 있음). 도형 예에서는 측정 unit EMU (English Metric Unit) 및 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 좌표를 계산해야 합니다.

첫 번째 요청은 화살표 도형의 왼쪽 테두리에 정렬되지만 화살표의 상단 가장자리 아래에 50pt (50 * 12,700 = 635,000 EMU)에 배치된 100 x 50pt 직사각형을 만듭니다. 새 직사각형의 X 좌표는 왼쪽 테두리를 정렬된 상태로 유지하기 위해 화살표의 X 좌표와 동일해야 합니다. 거리는 화살표의 상단에서 측정되므로 Y 좌표는 화살표의 Y 좌표에 50pt를 더한 값과 같습니다. 따라서 직사각형의 좌표는 다음과 같습니다.

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

두 번째 요청은 화살표 도형 예와 동일한 가로 중심선을 갖지만 화살표의 오른쪽 가장자리에서 오른쪽으로 100pt (1,270,000 EMU)에 배치된 40pt 너비의 원을 만듭니다. 원의 X 좌표는 화살표의 X 좌표, 화살표 너비, 100pt의 합입니다. 새 원의 중심선 정렬을 적용하려면 화살표와 원의 높이를 모두 고려해야 합니다. 원의 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 이동합니다 (상대 변환 applyMode 사용). 사용된 transformation1 행렬은 요소의 크기와 방향을 변경하지 않도록 구성됩니다.

두 요청을 모두 실행한 후 화살표의 왼쪽 상단 모서리는 (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 메서드에 대한 세 개의 별도 호출로 표시되지만 이러한 변환 행렬의 곱을 미리 계산한 후 해당 곱을 단일 요청으로 적용하는 것이 더 효율적입니다.

변환 변환의 경우 화살표 도형의 중심이 원점으로 이동합니다. 매개변수 값은 명확성을 위해 계산으로 표현됩니다.

다음은 요소를 반영하기 위한 요청 프로토콜입니다.

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 메서드에 대한 세 개의 별도 호출로 표시되지만 이러한 변환 행렬의 곱을 미리 계산한 후 해당 곱을 단일 요청으로 적용하는 것이 더 효율적입니다.

변환 변환의 경우 화살표 도형의 중심이 원점으로 이동합니다. 매개변수 값은 명확성을 위해 계산으로 표현됩니다.

다음은 요소 크기를 조정하기 위한 요청 프로토콜입니다.

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 메서드 이러한 변환 행렬의 곱을 미리 계산한 후 해당 곱을 단일 요청으로 적용하는 것이 더 효율적입니다.

변환 변환의 경우 화살표 도형의 중심이 원점으로 이동합니다. 매개변수 값은 명확성을 위해 계산으로 표현됩니다.

다음은 중심을 기준으로 요소를 회전하기 위한 요청 프로토콜입니다.

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"
        }
      }
    }
  ]
}