SVGLineElement: x2 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 x2 của giao diện SVGLineElement mô tả giá trị tọa độ trục x của điểm cuối của đường dưới dạng SVGAnimatedLength. Nó phản ánh thuộc tính hình học x2 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í cuối đó dọc theo trục x 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="0" 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 x2:

js
const lines = document.querySelectorAll("line");
const x2Pos0 = lines[0].x2;
const x2Pos1 = lines[1].x2;
console.dir(x2Pos0.baseVal.value); // output: 40 (giá trị của `x2`)
console.dir(x2Pos1.baseVal.value); // output: 90 (30% của 300)

Thông số kỹ thuật

Thông số kỹ thuật
Scalable Vector Graphics (SVG) 2
# __svg__SVGLineElement__x2

Tương thích trình duyệt

Xem thêm