Google Slides API מאפשר לשנות את המיקום, הגודל והכיוון של PageElement (תיבות טקסט, תמונות, טבלאות וצורות בסיסיות) בדף, תוך שמירה על קווים ישרים ושימור על נקודות ועל קווים מקבילים. הן נקראות טרנספורמציות אליפטיות. הדוגמאות הבאות מציגות כמה פעולות נפוצות של טרנספורמציה של רכיבי דף באמצעות השיטה presentations.batchUpdate.
בדוגמאות האלה נעשה שימוש במשתנים הבאים:
- PRESENTATION_ID – מציין איפה מספקים את מזהה המצגת. אפשר למצוא את הערך של המזהה הזה מכתובת ה-URL של המצגת.
- PAGE_ID – מציין איפה מציינים את מזהה אובייקט הדף. אפשר לאחזר את הערך הזה מכתובת ה-URL או באמצעות בקשת קריאה ל-API.
- PAGE_ELEMENT_ID – מציין את המיקום שבו מציינים את מזהה האובייקט של רכיב הדף. תוכלו לציין את המזהה הזה לרכיבים שאתם יוצרים (עם הגבלות מסוימות) או לאפשר ל-Slides API ליצור אותו באופן אוטומטי. אפשר לאחזר את מזהי הרכיבים באמצעות בקשת קריאה ל-API.
הדוגמאות האלה מוצגות כבקשות 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 מראה איך להשתמש ב-method CreateShapeRequest כדי ליצור צורות חדשות במיקומים הנכונים שמתאימים לצורת החץ לדוגמה בדף. בשני המקרים, צריך לחשב את הקואורדינטות X ו-Y של הפינה הימנית העליונה של הצורה החדשה.
הבקשה הראשונה יוצרת מלבן בגודל 100 על 50 נקודות (pt) שמיושר לקצה הימני של צורת החץ, אבל ממוקם 50 נקודות (50 * 12,700 = 635,000 EMU) מתחת לקצה העליון של החץ. כדי שהגבול הימני של המלבן החדש יהיה מיושר, קואורדינטת ה-X של המלבן החדש צריכה להיות זהה לקווי ה-X של החץ. קואורדינטת ה-Y זהה לקווית ה-Y של החץ בתוספת 50 נקודות, כי המרחק נמדד מהחלק העליון של החץ. לכן, הקואורדינטות של המלבן הן:
x" = 2000000 EMU y" = 550000 + (50 * 12700) = 1185000 EMU
הבקשה השנייה יוצרת עיגול ברוחב 40 פיקסלים עם אותו קו מרכזי אופקי כמו החץ בדוגמה, אבל הוא ממוקם 100 פיקסלים (1,270,000 EMU) מימין לקצה הימני של החץ. קואורדינטת ה-X של העיגול היא הסכום של קואורדינטת ה-X של החץ, רוחב החץ ו-100 נקודות. כדי לאכוף יישור קו אמצע למעגל החדש, צריך להביא בחשבון גם את הגובה של החץ וגם של המעגל. קואורדינטת ה-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 מראה איך להשתמש ב-method UpdatePageElementTransformRequest כדי לתרגם את רכיב הדף לדוגמה בצורת חץ בשתי דרכים שונות.
הבקשה הראשונה באצווה מעבירה את החץ לקואורדינטת ה-EMU (X,Y) = (2000000, 150000)
ומשתמשת בתרגום מוחלט
applyMode.
הבקשה השנייה באצווה מעבירה את החץ לשם: 40,000 EMUapplyMode
אחרי ביצוע שתי הבקשות, הפינה הימנית העליונה של החץ נמצאת בקואורדינטה (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 כדי לשקף את רכיב הדף דוגמת החץ אופקית לאורך מרכזו, בלי לשנות את המיקום שלו בדף או את הגודל שלו.
כדי לעשות זאת, משתמשים בטרנספורמציה בסיסית של השתקפות במסגרת העזר של הרכיב. לצורך הבהרה, ההזזה וההשתקפות של מסגרת העזר מוצגות בשלוש קריאות נפרדות ל-method 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%, תוך שמירה על מרכז החץ באותו מיקום ושמירה על הכיוון שלו.
כדי לעשות זאת, משתמשים בטרנספורמציה בסיסית של קנה מידה במסגרת העזר של הרכיב. לצורך הבהרה, ההזזה והשינוי של מסגרת העזר מוצגים בשלוש קריאות נפרדות ל-method 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 מוסבר איך להשתמש ב-method UpdatePageElementTransformRequest כדי לסובב את רכיב הדף דוגמת החץ ב-35 מעלות נגד כיוון השעון, תוך שמירה על מיקום מרכז החץ ועל הגודל שלו.
לשם כך, משתמשים בטרנספורמציה של רוטציה בסיסית במסגרת העזר של האלמנט. לצורך הבהרה, ההזזה והסיבוב של מסגרת העזר מוצגים בשלושה קריאות נפרדות ל-method 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"
}
}
}
]
}