SVGSVGElement: checkEnclosure() 方法
SVGSVGElement 介面的 checkEnclosure() 方法用於檢查給定元素的渲染內容是否完全包含在提供的矩形區域內。
每個候選圖形元素僅當與 pointer-events 處理中定義的可以作為指標事件目標的圖形元素相同時，才被視為匹配。
語法
js
checkEnclosure(element, rect)
引數
返回值
布林值。
示例
檢查一個元素是否包含在矩形內
html
<svg id="exampleSVG" width="200" height="200">
<rect
id="checkRect"
x="10"
y="10"
width="100"
height="100"
fill="none"
stroke="red" />
<circle id="targetElement" cx="50" cy="50" r="30" fill="blue" />
</svg>
<button id="checkEnclosureBtn">Check Enclosure</button>
<pre id="result"></pre>
js
const svgElement = document.getElementById("exampleSVG");
const checkRect = svgElement.getElementById("checkRect");
const targetElement = svgElement.getElementById("targetElement");
const resultDisplay = document.getElementById("result");
document.getElementById("checkEnclosureBtn").addEventListener("click", () => {
const rect = svgElement.createSVGRect();
rect.x = checkRect.x.baseVal.value;
rect.y = checkRect.y.baseVal.value;
rect.width = checkRect.width.baseVal.value;
rect.height = checkRect.height.baseVal.value;
const isEnclosed = svgElement.checkEnclosure(targetElement, rect);
resultDisplay.textContent = `Is the circle enclosed in the rectangle? ${isEnclosed}`;
});
規範
| 規範 |
|---|
| Scalable Vector Graphics (SVG) 2 # __svg__SVGSVGElement__checkEnclosure |
瀏覽器相容性
載入中…