Un tracé libre : lignes, courbes et surfaces
Dessiner une forme point par point, avec des segments droits et des courbes, remplie d'une couleur ou d'un dégradé, et cernée d'un trait.
Résumé
Le crayon libre : vous posez la pointe, et le trait suit partout où vous l'emmenez. Les segments droits font des triangles, des flèches et des polygones ; les courbes font des arrondis, des vagues et des cercles parfaits. C'est de cela que sont faits un filet sous un titre, un bandeau derrière un intitulé et l'ornement d'un diplôme.
Techniquement
Demandé avec
"type": "path"
Un tracé est une suite de segments écrits directement dans le flux de la page et appliqués dans l'ordre : move_to ouvre un contour en un point avec m, line_to le prolonge d'une droite avec l, curve_to y ajoute une Bézier cubique passant par deux points de contrôle avec c, et close referme le contour sur son origine avec h. Une page ne connaît ni opérateur de cercle ni opérateur d'arc : huit autres segments demandent donc une forme par son nom, et les courbes sont calculées pour elle — circle, ellipse, arc, rounded_rect et rounded_polyline ouvrent chacun leur propre contour, et arc_to, arc_through et elliptical_arc repartent de là où le tracé se trouve déjà. Aucun morceau ne tourne de plus d'un quart de tour, donc un cercle fait quatre courbes. Chaque coordonnée est un nombre ou une expression, donc un tracé se cale sur la largeur de la page sans que le client calcule quoi que ce soit ; les rayons sont des nombres simples et les angles des degrés dans le sens inverse des aiguilles d'une montre. La peinture se dit en deux clés indépendantes, le remplissage et le trait ; le remplissage accepte une couleur ou le nom d'un dégradé déclaré. Un masque facultatif limite ce que l'article laisse voir, et il ne vaut que pour lui : les articles suivants restent entiers.
Schéma de la requête
Clé obligatoire : segments, un tableau d'étapes, chacune {"move_to": {"x", "y"}}, {"line_to": {"x", "y"}}, {"curve_to": {"x1","y1","x2","y2","x","y"}} ou la chaîne "close" ; chaque coordonnée est un nombre ou une expression. Huit étapes nomment une forme à la place : {"circle": {"centre", "r"}}, {"ellipse": {"centre", "rx", "ry"}}, {"arc": {"centre", "r", "start", "sweep"}}, {"arc_to"} avec ces mêmes quatre, {"arc_through": {"from", "via", "to"}}, {"elliptical_arc": {"from", "to", "rx", "ry", "large", "clockwise", "x_rotation", "enlarge_radii"}}, {"rounded_rect": {"rect", "radius"}} et {"rounded_polyline": {"points", "radius", "close"}} ; un centre, un from, un via, un to et chacun des points est un objet de x et y, rect est les quatre coins habituels, r, rx, ry et radius sont des longueurs en points, start, sweep et x_rotation sont des degrés dans le sens inverse des aiguilles d'une montre, et large, clockwise, enlarge_radii et close valent faux par défaut. enlarge_radii agrandit les deux rayons d'un arc trop courts pour aller d'un bout à l'autre, du moins qu'il faut pour qu'ils y parviennent ; un radius négatif creuse chaque coin d'un rounded_polyline au lieu de l'arrondir. Facultatives : fill, une couleur ou {"shading": "name"} ; stroke, un objet avec un width obligatoire plus color (noir par défaut), dash (un objet avec un lengths obligatoire et un phase, 0 par défaut), cap (butt par défaut, round, projecting) et join (miter par défaut, round, bevel) ; clip, un objet avec un segments obligatoire et une rule (nonzero par défaut, even_odd) ; graphics_state, le nom d'un état graphique déclaré ; pages, un tableau d'entiers comptés à partir de 1, vide par défaut ; transform, six nombres ; rotate, degrés dans le sens inverse des aiguilles d'une montre autour du centre du rectangle ; layer, le nom d'un calque déclaré. Refus croisés : transform avec rotate ; un clip dont les segments sont vides ; un rayon nul, un arc dont les deux bouts sont au même endroit, des rayons trop petits pour aller d'un bout à l'autre sans enlarge_radii, trois points qui ne nomment aucun cercle, un arc de cercle dont le rayon est négatif, et une suite de moins de deux points. Une forme prend fill, stroke, ou les deux.
Une requête entière qui crée un PDF
{
"items": [
{
"type": "path",
"clip": { "rule": "nonzero", "segments": [
{"move_to": {"x": 60, "y": 690}},
{"line_to": {"x": 290, "y": 690}},
{"line_to": {"x": 290, "y": 790}},
{"line_to": {"x": 60, "y": 790}},
"close"
] },
"segments": [
{"move_to": {"x": 72, "y": 700}},
{"line_to": {"x": 272, "y": 700}},
{"line_to": {"x": 172, "y": 780}},
"close"
],
"fill": [0.85, 0.89, 0.95],
"stroke": {"width": 1.0}
}
]
}
Formes
Un rectangle plein ou encadré Une ligne droite entre deux points Un dessin déclaré une fois et posé autant de fois qu'on veut
Où aller ensuite
Toutes les clés JSON d'une requête, en une page Les vingt-deux autres choses que l'on peut dessiner