Commentaire: Le dessin des ellips en toile est une exigence très courante, mais la plupart des navigateurs n'ont pas encore implémenté cette méthode, ils utilisent donc souvent une méthode d'arc ou d'Arcto pour combiner la déformation d'échelle pour dessiner des ellips. Les amis intéressés peuvent en apprendre davantage, en espérant que cela puisse vous aider.
Dessiner des ellips en toile est une exigence très courante. Le nouveau projet HTML Canvas 2D ContextW3C a ajouté une méthode Ellipse pour dessiner des ellips, mais la plupart des navigateurs n'ont pas encore mis en œuvre cette méthode, il est donc nécessaire d'utiliser une méthode ARC ou ARCTO combinée à une déformation d'échelle pour dessiner des ellips.
Exemple de code:
<lebvas> </ canvas>
<cript>
var ctx = documentQuerySelector ('canvas') getContext ('2d');
ctxlineWidth = "10";
CTXSCALE (1,2);
CTXARC (150,150,100,0, mathpi * 2, false);
ctxstroke ();
</cript>
C'est un peu faux, car les lignes sont inégales en épaisseur et la course est également affectée par l'échelle.
Pour résoudre ce problème, nous avons besoin d'un petit truc.
Exemple de code:
[code]
<lebvas> </ canvas>
<cript>
var ctx = documentQuerySelector ('canvas') getContext ('2d');
ctxlineWidth = "10";
ctxsave ();
CTXSCALE (1,2);
CTXARC (150,150,100,0, mathpi * 2, false);
ctxRestore ();
ctxstroke ();
</cript>
[/code]
Maintenant même, parfait.
L'astuce consiste à enregistrer d'abord l'état de toile, puis à faire évoluer et à appeler la commande Path, puis à restaurer l'état de canevas, puis à le tirer.
Le point clé est d'enregistrer d'abord, puis de zoomer, de restaurer d'abord puis de caresser.