scale

En appliquant la transformation scale(a,b) à une image, on multiplie toutes les abscisses par a et toutes les ordonnées par b.

On peut également utiliser la syntaxe scale(a) équivalente à scale(a,a).

Exemple de code

Sur l'exemple ci-dessous, on a utilisé scale(0.5,3), le sommet de coordonnées (10, 10) est donc transformé en un point de coordonnées (5, 30), le sommet (10, 60) est envoyé sur le sommet (5, 180) et le sommet (30,50) sur le point (15, 150).

Pour lire les coordonnées des points, on a ici ajouté une grille avec des lignes horizontales commençant par la ligne d'équation x = 0 puis x = 10, x = 20, ... et ainsi de suite de 10 en 10. Même chose pour les verticales.

<!DOCTYPE html>
<html lang="fr">
	<head>
		<meta charset="utf-8">
		<title> cercle</title>
	</head>

<body>

var verticales = document.getElementById("verticales");
var vert = '';
for(let i = 0; i < 100; i+=10) {
	vert += '<line y1="0" y2="200" x1="';
	vert += i + '" x2="';
	vert += i + '" />';
}
verticales.innerHTML = vert;

</script>

</body>
</html>

scale() avec les coordonnées

Dans le code ci-dessous, on obtient le même effet de tranformation sur le second triangle, sans utiliser scale().

Homothéties : définition

Le plan est muni d'un repère \(\left( O; \overrightarrow{i}, \overrightarrow{j}\right) \).

L'image d'un point \( M(x;y) \) par l'homothétie de centre \( \Omega(a;b) \) et de rapport le réel \( k \) est le point \( M' \left( x_{\Omega} + k x_{\overrightarrow{\Omega M}} ,y_{\Omega} + k y_{\overrightarrow{\Omega M}}\right) \).
C'est donc le point \( M' \) tel que \( \overrightarrow{\Omega M'} = k\, \overrightarrow{\Omega M} \).

Exemple en SVG en agissant directement sur les coordonnées.

On illustre ici avec \( k = 0{,}5 \) et \( \Omega(50, 60) \).

Avec scale

\( \overrightarrow{\Omega M'} = k\, \overrightarrow{\Omega M} \) s'écrit \( M' \left( x_{\Omega} + k (x_M - x_{\Omega}) ,y_{\Omega} + k ( y_M - y_{\Omega})\right) \). Ce qui s'écrit aussi : \[ M' \left( (1-k)x_{\Omega} + k x_M , (1-k)y_{\Omega} + k y_M \right) \] On applique donc en premier lieu un changement d'échelle de rapport k (c'est à dire une homothétie de centre l'origine et de rapport k) puis on applique une translation de vecteur \( \overrightarrow{w}((1-k)x_{\Omega}, (1-k)y_{\Omega}) \).

Ce qui donne (en écrivant dans le code les transformations de droite à gauche) :

En utilisant scale (bis).

\( \overrightarrow{\Omega M'} = k\, \overrightarrow{\Omega M} \) s'écrit \( M' \left( x_{\Omega} + k (x_M - x_{\Omega}) ,y_{\Omega} + k ( y_M - y_{\Omega})\right) \). On fait donc subir à M une translation de vecteur \( \overrightarrow{u}(-x_{\Omega}, -y_{\Omega}) \), on applique ensuite un changement d'échelle de coefficient k et on fait ensuite une translation de vecteur \( \overrightarrow{u}(x_{\Omega}, y_{\Omega}) \).

En notant dans le code les transformations de droite à gauche :