SVGEllipseElement: rx 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 rx của giao diện SVGEllipseElement mô tả bán kính trục x của hình elip dưới dạng SVGAnimatedLength. Nó phản ánh giá trị tính toán của thuộc tính rx trên phần tử <ellipse>.

Giá trị thuộc tính là một <length>, <percentage>, hoặc <number>. Giá trị số của SVGAnimatedLength.baseVal là bán kính của hình elip dọc theo trục x trong hệ tọa độ người dùng.

Giá trị

Một SVGAnimatedLength.

Ví dụ

Cho SVG sau:

html
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
  <ellipse cx="50" cy="75" rx="30" ry="20" fill="blue" />
  <ellipse cx="25%" cy="50%" rx="10%" ry="5%" fill="red" />
</svg>

Chúng ta có thể truy cập các giá trị tính toán của thuộc tính rx:

js
const ellipses = document.querySelectorAll("ellipse");
const rxPos0 = ellipses[0].rx;
const rxPos1 = ellipses[1].rx;

console.dir(rxPos0.baseVal.value); // output: 30
console.dir(rxPos1.baseVal.value); // output: 20 (10% của 200)

Thông số kỹ thuật

Specification
Scalable Vector Graphics (SVG) 2
# __svg__SVGEllipseElement__rx

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

Xem thêm