ホームページ > 記事 > ウェブフロントエンド > JavaScriptのsave()メソッドはどのような用途に使われますか?
JavaScriptのsave()メソッドはどのような用途に使われますか?
- 青灯夜游オリジナル
- 2021-06-28 17:55:214103ブラウズ
JavaScript では、save() メソッドは、現在のイメージ状態のコピーを保存するために使用されます。このメソッドは、現在の状態のコピーを、イメージ状態を保存するスタックにプッシュします。構文形式は "save( ）」。
このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。
save() メソッドは、HTML DOM CanvasRenderingContext2D オブジェクトのメソッドです。
save() メソッドは、現在のイメージ状態のコピーを保存します。
構文
save()
説明
save() メソッドは、現在の状態のコピーをイメージの状態を保持するスタックにプッシュします。これにより、イメージの状態を一時的に変更し、restore() を呼び出して以前の値を復元することができます。
キャンバスのグラフィックス状態には、CanvasRenderingContext2D オブジェクトのすべてのプロパティが含まれます (読み取り専用のキャンバス プロパティを除く)。また、rotate()、scale()、translate() を呼び出した結果である変換行列も含まれています。さらに、これには、clip() メソッドで指定されたクリッピング パスが含まれています。ただし、現在のパスと現在位置はグラフィックス状態の一部ではないため、このメソッドでは保存されないことに注意してください。
注:
save() メソッドとrestore() メソッドを有効にするには、一緒に使用する必要があります。
save() メソッドは、save() で設定したさまざまなスタイルと属性を保存します。
例
最初にsaveメソッドでボックスを作成しました
<body> <canvas id="" width="600" height="400"></canvas>; </body> <script type="text/javascript"> var pen = document.querySelector('canvas').getContext('2d'); // 调用save方法 pen.save(); // 改变基点的位置 pen.translate(300,300); // 设置填充颜色 pen.fillStyle = 'red'; pen.fillRect(0,0,100,100); pen.restore(); </script>
カラー スタイルと基点を設定したことがわかります。
復元したとき 後でボックスを追加したとき
<body> <canvas id="" width="600" height="400"></canvas>; </body> <script type="text/javascript"> var pen = document.querySelector('canvas').getContext('2d'); // 调用save方法 pen.save(); pen.translate(300,300); // 设置填充颜色 pen.fillStyle = 'red'; pen.fillRect(0,0,100,100); pen.restore(); // 这里我在创建一个盒子 pen.beginPath(); pen.fillStyle = 'black'; pen.fillRect(0,0,100,100); pen.fill(); </script>
save メソッドの外で設定したプロパティは、保存中のプロパティと保存中の基点には影響を及ぼさないことがわかりました。設定にも影響はありません。 save メソッドの外で設定されたボックスに影響します。
概要: 保存メソッドは、設定したコンテンツを分離することと同等であり、外部のコンテンツには影響しません。
【関連する推奨事項: JavaScript 学習チュートリアル】
以上がJavaScriptのsave()メソッドはどのような用途に使われますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。