Beispiel
Zeichnen eines Rechtecks, Zunder zu 200%, dann wieder zeichnen Rechteck:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
Versuch es selber " Browser-Unterstützung
Die Zahlen in der Tabelle geben Sie die erste Browser-Version, die die Methode vollständig unterstützt.
| Methode | |||||
|---|---|---|---|---|---|
| scale() | 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Definition und Verwendung
Die scale() Methode skaliert die aktuelle Zeichnung, größer oder kleiner.
Note: Wenn Sie eine Zeichnung maßstabs, alle zukünftigen Zeichnungen werden auch skaliert werden. Die Positionierung wird auch skaliert werden. Wenn Sie scale(2,2) ; Zeichnungen werden doppelt so weit von links und oben auf der Leinwand, wie Sie angeben, positioniert werden.
| JavaScript-Syntax: | context . scale( scalewidth,scaleheight ) ; |
|---|
Parameterwerte
| Parameter | Beschreibung | Spiel es |
|---|---|---|
| scalewidth | Skaliert die Breite der aktuellen Zeichnung (1=100%, 0.5=50%, 2=200%, etc.) | Spiel es " |
| scaleheight | Waagen , die Höhe der aktuellen Zeichnung (1=100%, 0.5=50%, 2=200%, etc.) | Spiel es " |
Mehr Beispiele
Beispiel
Zeichnen eines Rechtecks, Zunder bis 200%, zeichnen Rechteck wieder Skala bis 200%, zeichnen Rechteck wieder Skala bis 200%, zeichnen Rechteck wieder:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15); Versuch es selber " <Canvas Object