Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> HTML

Cách vẽ elip (Ellipse) trong HTML5 SVG

SVG (Scalable Vector Graphics) là ngôn ngữ XML mô tả đồ họa vector 2D. Để vẽ elip, dùng phần tử <ellipse>.

Ví dụ

Mã sau vẽ một elip màu xanh dương:

<!DOCTYPE html>
<html>
<head>
<style>
#svgelem {
  position: relative;
  left: 10%;
  transform: translateX(-20%);
}
</style>
<title>HTML5 SVG Ellipse</title>
</head>
<body>
<h2>HTML5 SVG Ellipse</h2>
<svg id = "svgelem" width = "300" height = "200" xmlns = "https://www.w3.org/2000/svg">
<ellipse cx = "120" cy = "50" rx = "100" ry = "50" fill = "blue" />
</svg>
</body>
</html>

Giải thích: cx, cy là tọa độ tâm; rx, ry là bán kính ngang và dọc.