자바스크립트 save() 메소드의 용도는 무엇입니까?
- 青灯夜游원래의
- 2021-06-28 17:55:214146검색
JavaScript에서 save() 메서드는 현재 이미지 상태의 복사본을 저장하는 데 사용됩니다. 이 메서드는 현재 상태의 복사본을 이미지 상태를 저장하는 스택에 푸시합니다. 구문 형식은 "save()"입니다.
이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.
save() 메서드는 HTML DOM CanvasRenderingContext2D 개체의 메서드입니다.
save() 메서드는 현재 이미지 상태의 복사본을 저장합니다.
Syntax
save()
Description
save() 메서드는 현재 상태의 복사본을 이미지 상태를 보유하는 스택에 푸시합니다. 이를 통해 이미지 상태를 일시적으로 변경한 다음, Restore()를 호출하여 이전 값을 복원할 수 있습니다.
캔버스의 그래픽 상태에는 CanvasRenderingContext2D 개체의 모든 속성이 포함됩니다(읽기 전용 캔버스 속성 제외). 또한rotate(), scale() 및translate() 호출의 결과인 변환 행렬도 포함되어 있습니다. 또한, 여기에는clip() 메서드를 통해 지정되는 클리핑 경로가 포함됩니다. 그러나 현재 경로와 현재 위치는 그래픽 상태의 일부가 아니며 이 방법으로 저장되지 않습니다.
참고:
save() 및 Restore() 메서드를 함께 사용해야 효과적입니다.
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() 메소드의 용도는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!