SVGSVGElement: thuộc tính preserveAspectRatio

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 preserveAspectRatio của giao diện SVGSVGElement phản ánh thuộc tính preserveAspectRatio của phần tử đã cho. Nó xác định cách nội dung của phần tử SVG nên được thu phóng để vừa với không gian đã cho, đồng thời duy trì tỉ lệ khung hình.

Giá trị

Một đối tượng SVGAnimatedPreserveAspectRatio.

Ví dụ

Với SVG sau, chúng ta có thể sử dụng thuộc tính preserveAspectRatio để lấy hành vi thu phóng cho phần tử SVG:

html
<svg
  xmlns="http://www.w3.org/2000/svg"
  viewBox="0 0 200 200"
  preserveAspectRatio="xMidYMid meet">
  <circle cx="100" cy="100" r="50" fill="blue" />
</svg>

Chúng ta có thể truy cập thuộc tính preserveAspectRatio:

js
const svgElement = document.querySelector("svg");

console.log(svgElement.preserveAspectRatio.baseVal); // output: SVGPreserveAspectRatio {align: 1, meetOrSlice: 1}

Thông số kỹ thuật

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

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

Xem thêm