Javascript 在没有HTML5画布的情况下绘制圆形_Javascript_Jquery_Html

Javascript 在没有HTML5画布的情况下绘制圆形

javascript jquery html

Javascript 在没有HTML5画布的情况下绘制圆形,javascript,jquery,html,Javascript,Jquery,Html,我想用HTML5图形画一个圆圈。这是因为我希望能够编辑圆的半径。圆需要是可选择的有可能用javascript实现这一点吗？您的范例对我来说没有意义，但您可以通过以下方式轻松画出一个圆圈： <div style="display:inline-block; background:#f00; width:250px; height:250px; border-radius:125px"></div>

我想用HTML5图形画一个圆圈。这是因为我希望能够编辑圆的半径。圆需要是可选择的

有可能用javascript实现这一点吗？

您的范例对我来说没有意义，但您可以通过以下方式轻松画出一个圆圈：

<div style="display:inline-block; 
        background:#f00; 
        width:250px; 
        height:250px; 
        border-radius:125px"></div>

只需确保边界半径至少为宽度/高度的一半。


<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Circle</title>
</head>
<body>

<style type="text/css">
  div.circle {
    border: 3px solid green;
    border-radius: 50%;
    width: 100px; 
    height: 100px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;    
  }
</style>

<div class=circle></div>

</body>
</html>

圆圈
分区圆{
边框：3倍纯绿；
边界半径：50%；
宽度：100px；
高度：100px；
框大小：边框框；
-moz框大小：边框框；
}

根据您需要的浏览器支持级别，您可以使用内嵌svg

<svg height="100" width="100">
    <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
</svg>

您可以使用css边框。只需使用边框半径进行div即可：100%感谢您的建议。似乎是最好的方式。“我想编辑它的大小”是一个没有意义的范例。您可以“编辑”画布块、SVG块、HTML元素、图像或背景图像的大小。谢谢您的评论。不知道我的范例出了什么问题。但是一旦你在画布上画了一个圆，你就不能再改变半径了。这完全是错误的。您始终可以使用不同的半径重新绘制它。这就是画布的意义：为了能够在必要时绘制和重画，我没有找到一种方法在不清除画布上所有元素的情况下重画一个圆。这种方法不受所有浏览器的支持，是html5图形的一部分，我希望避免使用