L'API Google Slides vous permet de manipuler l'emplacement, la taille et l'orientation d'un élément PageElement (boîtes de texte, images, tableaux et formes de base) sur une page, tout en gardant les lignes droites et en préservant les points et les lignes parallèles. On les appelle transformations affines. Les exemples présentés ici illustrent quelques opérations de transformation d'élément de page courantes utilisant la méthode presentations.batchUpdate.
Ces exemples utilisent les variables suivantes:
- PRESENTATION_ID : indique où vous devez fournir l'ID de la présentation. Vous pouvez découvrir la valeur de cet ID à partir de l'URL de la présentation.
- PAGE_ID : indique où vous devez fournir l'ID de l'objet de la page. Vous pouvez récupérer la valeur correspondante à partir de l'URL ou à l'aide d'une requête de lecture d'API.
- PAGE_ELEMENT_ID : indique où vous devez fournir l'ID de l'objet de l'élément de page. Vous pouvez spécifier cet ID pour les éléments que vous créez (avec certaines restrictions) ou autoriser l'API Slides à en créer un automatiquement. Les ID d'élément peuvent être récupérés via une requête de lecture de l'API.
Ces exemples sont présentés comme des requêtes HTTP afin de ne pas tenir compte du langage. Pour découvrir comment implémenter une mise à jour par lot dans différents langages à l'aide des bibliothèques clientes des API Google, consultez Ajouter des formes et du texte.
Exemple de forme de flèche
Pour les exemples ci-dessous, supposons qu'il existe un exemple d'élément de page en forme de flèche avec les données de taille et de transformation suivantes (disponibles avec une requête de méthode presentations.pages.get). L'exemple de forme utilise les mesures unit EMU (English Metric Unit) et pt (point).
{
"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"
}
}Aligner un élément avec un autre
L'exemple de code presentations.batchUpdate suivant montre comment utiliser la méthode CreateShapeRequest pour créer des formes aux positions correctes, alignées sur l'exemple de forme de flèche sur la page. Dans les deux cas, les coordonnées X et Y du coin supérieur gauche de la nouvelle forme doivent être calculées.
La première requête crée un rectangle de 100 x 50 pt aligné sur le bord gauche de la forme de flèche, mais situé 50 pt (50 * 12 700 = 635 000 EMU) sous le bord supérieur de la flèche. La coordonnée X du nouveau rectangle doit être identique à celle de la flèche pour que sa bordure gauche reste alignée. La coordonnée Y est identique à celle de la flèche, plus 50 pt, car la distance est mesurée à partir du sommet de la flèche. Les coordonnées du rectangle sont donc les suivantes:
x" = 2000000 EMU y" = 550000 + (50 * 12700) = 1185000 EMU
La deuxième requête crée un cercle de 40 pt de large qui a la même ligne médiane horizontale que l'exemple de flèche, mais est positionné à 100 pt (1 270 000 EMU) à droite du bord droit de la flèche. La coordonnée X du cercle correspond à la somme de la coordonnée X de la flèche, de la largeur de la flèche et de 100 points. Pour appliquer un alignement sur la ligne médiane au nouveau cercle, vous devez tenir compte de la hauteur de la flèche et du cercle. La coordonnée Y du cercle correspond à la coordonnée Y de la flèche, plus la moitié de la hauteur de la flèche moins la moitié de la hauteur du cercle. Dans les deux cas, les facteurs de mise à l'échelle associés à la flèche doivent également être pris en compte, car ils affectent la largeur et la hauteur affichées de la flèche. Les coordonnées du cercle sont donc les suivantes:
x = 2000000 + (0.3 * 3000000) + (100 * 12700) = 4170000 EMU y = 550000 + (0.5 * 0.12 * 3000000) - (0.5 * 40 * 12700) = 476000 EMU
Voici le protocole de requête permettant d'aligner un élément sur un autre:
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"
}
}
}
}
]
}Déplacer un élément
L'exemple de code presentations.batchUpdate suivant montre comment utiliser la méthode UpdatePageElementTransformRequest pour traduire l'élément de page exemple de forme de flèche de deux manières différentes.
La première requête du lot déplace la flèche vers les coordonnées EMU (X,Y) = (2000000, 150000) (à l'aide d'une translation absolue
applyMode). La deuxième requête du lot déplace la flèche à partir de là, cette fois de 40 000 EMU vers la droite et de 35 000 EMU vers le haut (à l'aide d'une translation relative applyMode). Les matrices transformation1 utilisées sont conçues pour éviter de modifier la taille et l'orientation de l'élément.
Une fois les deux requêtes exécutées, l'angle supérieur gauche de la flèche se trouve aux coordonnées (X,Y)= (2040000, 115000) de l'EMU.
Voici le protocole de requête pour déplacer un élément:
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"
}
}
}
]
}Refléter un élément
L'exemple de code presentations.batchUpdate suivant montre comment utiliser la méthode UpdatePageElementTransformRequest pour refléter l'élément de page exemple de forme de flèche horizontalement le long de son centre, sans modifier sa position sur la page ni sa mise à l'échelle.
Pour ce faire, utilisez une transformation de réflexion de base dans le cadre de référence de l'élément. Pour plus de clarté, le décalage et la réflexion du cadre de référence sont affichés avec trois appels distincts à la méthode UpdatePageElementTransformRequest, mais il est plus efficace de précalculer le produit de ces matrices de transformation, puis d'appliquer ce produit en tant que requête unique.
Pour les transformations translation, le centre de la forme de la flèche est déplacé vers et depuis l'origine. Pour plus de clarté, les valeurs des paramètres sont exprimées sous forme de calculs.
Voici le protocole de requête permettant de refléter un élément:
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"
}
}
}
]
}Redimensionner un élément
L'exemple de code presentations.batchUpdate suivant montre comment utiliser la méthode UpdatePageElementTransformRequest pour redimensionner l'élément de page de l'exemple de forme de flèche afin qu'il soit 50 % plus large et ne mesure que 80% de sa hauteur actuelle, tout en conservant le centre de la flèche dans la même position et en maintenant son orientation.
Pour ce faire, utilisez une transformation de mise à l'échelle de base dans le cadre de référence de l'élément. Pour plus de clarté, le décalage et la mise à l'échelle du frame de référence sont affichés avec trois appels distincts à la méthode UpdatePageElementTransformRequest, mais il est plus efficace de précalculer le produit de ces matrices de transformation, puis d'appliquer ce produit en tant que requête unique.
Pour les transformations de translation, le centre de la forme de la flèche est déplacé vers et depuis l'origine. Pour plus de clarté, les valeurs des paramètres sont exprimées sous forme de calculs.
Voici le protocole de requête permettant de redimensionner un élément:
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"
}
}
}
]
}Faire pivoter un élément autour de son centre
L'exemple de code presentations.batchUpdate suivant montre comment utiliser la méthode UpdatePageElementTransformRequest pour faire pivoter l'élément de page exemple de forme de flèche de 35 degrés dans le sens inverse des aiguilles d'une montre, tout en conservant le centre de la flèche dans la même position et en maintenant sa taille.
Pour ce faire, utilisez une transformation de rotation de base dans le cadre de référence de l'élément. Pour plus de clarté, le décalage et la rotation du cadre de référence sont affichés avec trois appels distincts à la méthode UpdatePageElementTransformRequest, mais il est plus efficace de précalculer le produit de ces matrices de transformation, puis d'appliquer ce produit en tant que requête unique.
Pour les transformations de translation, le centre de la forme de flèche est déplacé vers et depuis l'origine. Pour plus de clarté, les valeurs des paramètres sont exprimées sous forme de calculs.
Voici le protocole de requête pour faire pivoter un élément autour de son centre:
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"
}
}
}
]
}