L'API Google Slides vous permet de manipuler l'emplacement, la taille et l'orientation d'un élément PageElement (zones 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. C'est ce que l'on appelle des transformations affines. Les exemples ci-dessous présentent certaines opérations courantes de transformation d'éléments de page effectuées avec la méthode presentations.batchUpdate.
Ces exemples utilisent les variables suivantes:
- PRESENTATION_ID : indique l'endroit où vous fournissez l'ID de présentation. Vous pouvez découvrir la valeur de cet ID à partir de l'URL de présentation.
- PAGE_ID : indique l'endroit où vous fournissez l'ID d'objet de page. Vous pouvez récupérer cette valeur à partir de l'URL ou à l'aide d'une requête de lecture API.
- PAGE_ELEMENT_ID : indique l'endroit où vous indiquez l'ID d'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 API.
Ces exemples sont présentés comme des requêtes HTTP afin d'être indépendants du langage. Pour découvrir comment mettre en œuvre une mise à jour par lot dans différents langages à l'aide des bibliothèques clientes de l'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 (accessible via une requête de méthode presentations.pages.get). L'exemple de forme utilise la mesure unit EMU (English Metric Unit) et le 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 et alignées avec l'exemple de forme de flèche sur la page. Dans les deux cas, les coordonnées X et Y de l'angle supérieur gauche de la nouvelle forme doivent être calculées.
La première requête crée un rectangle de 100 x 50 points aligné sur la bordure gauche de la forme de flèche, mais placé à 50 pts (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 à la coordonnée X de la flèche pour que sa bordure gauche reste alignée. La coordonnée Y est identique à la coordonnée Y de la flèche plus 50 pt, car la distance est mesurée à partir du haut de la flèche. Les coordonnées du rectangle sont donc:
x" = 2000000 EMU y" = 550000 + (50 * 12700) = 1185000 EMU
La deuxième requête crée un cercle de 40 points ayant la même ligne centrale horizontale que l'exemple de flèche, mais positionné de 100 points (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 centrale au nouveau cercle, il faut prendre en compte 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 de la flèche affichée. 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 avec 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 la coordonnée EMU (X,Y) = (2000000, 150 000) (à l'aide d'une traduction absolue
applyMode). La deuxième requête du lot déplace la flèche de là, cette fois 40 000 EMU vers la droite et 35 000 EMU utilisées pour une transformation de la matrice vers la droite et une transformation vers le haut de la matrice applyMode.
Après avoir exécuté les deux requêtes, l'angle supérieur gauche de la flèche reste au niveau de la coordonnée EMU (X,Y) = (2040000, 115 000).
Voici le protocole de requête permettant de 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 du frame de référence et la réflexion 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 traduction, 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 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 mettre à l'échelle l'élément de page exemple de forme de flèche afin qu'il soit plus large de 50 % et n'a que 80% de sa hauteur actuelle, tout en gardant le centre de la flèche à la même position et en conservant son orientation.
Pour ce faire, utilisez une transformation de scaling de base dans le frame de référence de l'élément. Pour plus de clarté, le décalage de trame de référence et la mise à l'échelle 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 traduction, 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 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 gardant le centre de la flèche à la même position et en conservant 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 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 traduction, 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 permettant de 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"
}
}
}
]
}