SVGLineElement: y1 property
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Thuộc tính chỉ đọc y1 của giao diện SVGLineElement mô tả điểm bắt đầu của đường SVG dọc theo trục y dưới dạng SVGAnimatedLength. Nó phản ánh thuộc tính hình học y1 của phần tử <line>.
Giá trị thuộc tính là một <length>, <percentage>, hoặc <number>. Giá trị số của SVGAnimatedLength.baseVal là vị trí bắt đầu đó dưới dạng độ dài dọc theo trục y trong đơn vị hệ tọa độ người dùng.
Giá trị
Một SVGAnimatedLength.
Ví dụ
Cho SVG sau:
html
<svg viewBox="0 0 300 200" xmlns="http://www.w3.org/2000/svg">
<line x1="20" y1="30" x2="40" y2="50" stroke="blue" stroke-width="2" />
<line x1="15%" y1="5%" x2="30%" y2="60%" stroke="red" stroke-width="4" />
</svg>
Chúng ta có thể truy cập các giá trị tính toán của thuộc tính y1:
js
const lines = document.querySelectorAll("line");
const y1Pos0 = lines[0].y1;
const y1Pos1 = lines[1].y1;
console.dir(y1Pos0.baseVal.value); // output: 30 (giá trị của `y1`)
console.dir(y1Pos1.baseVal.value); // output: 10 (5% của 200)
Thông số kỹ thuật
| Thông số kỹ thuật |
|---|
| Scalable Vector Graphics (SVG) 2 # __svg__SVGLineElement__y1 |