HTML 캔버스 miterLimit 속성
예시
최대 사접 길이가 5인 선을 그립니다.
자바스크립트:
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.lineWidth = 10;
ctx.lineJoin = "miter";
ctx.miterLimit = 5;
ctx.moveTo(20, 20);
ctx.lineTo(50, 27);
ctx.lineTo(20, 34);
ctx.stroke();
브라우저 지원
표의 숫자는 속성을 완전히 지원하는 첫 번째 브라우저 버전을 지정합니다.
| Property | |||||
|---|---|---|---|---|---|
| miterLimit | Yes | 9.0 | Yes | Yes | Yes |
정의 및 사용
miterLimit 속성은 최대 사접 길이를 설정하거나 반환합니다.
마이터 길이는 두 선이 만나는 내부 모서리와 외부 모서리 사이의 거리입니다.
팁: miterLimit 속성은 lineJoin 속성이 "miter"인 경우에만 작동합니다.
모서리의 각도가 작아질수록 마이터 길이가 커집니다.
마이터 길이가 너무 긴 것을 방지하기 위해 miterLimit 속성을 사용할 수 있습니다.
마이터 길이가 miterLimit 값을 초과하면 모서리가 lineJoin 유형 "베벨"로 표시됩니다(그림 3).
| 기본값: | 10 |
|---|---|
| 자바스크립트 구문: | 컨텍스트 .miterLimit= 숫자 ; |
속성 값
| Value | Description | Play it |
|---|---|---|
| number | A positive number that specifies the maximum miter length. If the current miter length exceeds the miterLimit, the corner will display as lineJoin "bevel" |
❮ HTML 캔버스 참조