SVG Shapes之椭圆 <ellipse>

3.椭圆 <ellipse>

示例3.1

<svg height="140" width="500">
  <ellipse cx="200" cy="80" rx="100" ry="50"
  style="fill:yellow;stroke:purple;stroke-width:2" />
</svg>

代码解释:

  • cx 属性定义圆点的 x 坐标
  • cy 属性定义圆点的 y 坐标
  • rx 属性定义水平半径
  • ry 属性定义垂直半径

示例3.2

<svg height="150" width="500">
  <ellipse cx="240" cy="100" rx="220" ry="30" style="fill:purple" />
  <ellipse cx="220" cy="70" rx="190" ry="20" style="fill:lime" />
  <ellipse cx="210" cy="45" rx="170" ry="15" style="fill:yellow" />
</svg>

示例3.3

<svg height="100" width="500">
  <ellipse cx="240" cy="50" rx="220" ry="30" style="fill:yellow" />
  <ellipse cx="220" cy="50" rx="190" ry="20" style="fill:white" />
</svg>

时间: 2024-10-31 16:45:17

SVG Shapes之椭圆 <ellipse>的相关文章

SVG Shapes之矩形 &lt;rect&gt;

SVG 形状 SVG 有一些预定义的形状元素,可被开发者使用和操作: 矩形 <rect> 圆形 <circle> 椭圆 <ellipse> 线 <line> 折线 <polygon> 多边形 <polyline> 路径 <path> 1.矩形 <rect> 示例1.1 <svg width="400" height="110"> <rect width=

使用Bakit对SVG编程时,如何从svg文件里获得ellipse结点的位置

问题描述 刚刚接触svg,想编一个可以显示图像和定位元素的小程序.现在遇到的问题是,在svg显示后并经过一系列的坐标平移和缩放变换后,如何获得文件里定义的ellipse在viewport里的现在的cx和cy坐标.通过DOM读出来的只是文档里定义的原始坐标.有没有帮帮忙呀....不胜感激 解决方案 解决方案二:帮帮忙呀....解决方案三:该回复于2011-05-10 13:00:23被版主删除

SVG Shapes之圆形 &lt;circle&gt;

2.圆形 <circle> 示例2.1 <svg height="100" width="100"> <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" /> </svg> 代码解释: cx 和 cy 属性

SVG Shapes之线条 &lt;line&gt;

4.线条 <line> 示例4.1 <svg height="210" width="500"> <line x1="0" y1="0" x2="200" y2="200" style="stroke:rgb(255,0,0);stroke-width:2" /> </svg> 代码解释: x1 属性在 x 轴定义线条的

SVG Shapes之折线 &lt;polyline&gt;

6.折线 <polyline> 示例6.1 <svg height="200" width="500"> <polyline points="20,20 40,25 60,40 80,120 120,140 200,180" style="fill:none;stroke:black;stroke-width:3" /> </svg> 示例6.2 <svg height=&

SVG Shapes之多边形 &lt;polygon&gt;

5.多边形 <polygon> 示例5.1 <svg height="210" width="500"> <polygon points="200,10 250,190 160,210" style="fill:lime;stroke:purple;stroke-width:1" /> </svg> 代码解释: points 属性定义多边形每个角的 x 和 y 坐标 示例5.2

HTML中使用SVG与SVG预定义形状元素介绍

SVG 文件可通过以下标签嵌入 HTML 文档:<embed>.<object>或者<iframe>.   复制代码 代码如下: <embed src="rect.svg" width="300"height="100" type="image/svg+xml" pluginspage="http://www.adobe.com/svg/viewer/install/&quo

求源码,用java定义形状类,随机产生圆,椭圆、矩形,并输出中心点、面积、周长

问题描述 急求源码啊!谢谢1.定义一个形状类,Point,Shape2.派生出矩形(Rectangle).圆(Circle).椭圆(Ellipse)3.完成其中可能存在的多态方法4.需要有每种形状的输出,包括中心点.面积.周长的输出这是我的作业哦.我不理解什么叫多态啊! 解决方案 解决方案二:建议你找java图形编程的书来看.解决方案三:引用1楼ylz2007的回复: 建议你找java图形编程的书来看. 有这必要吗?我看楼主的意思是应用面向对象的啊!解决方案四:多态就是父类引用指向子类对象,运行

稳扎稳打Silverlight 2.0系列文章索引

在线DEMO http://www.cnblogs.com/webabcd/archive/2008/10/09/1307486.html 1.稳扎稳打Silverlight(1) - 1.0实例之电子表 2.稳扎稳打Silverlight(2) - 1.0实例之支持录音和回放的钢琴(Silverlight+ASP.NET AJAX+DLINQ) 3.稳扎稳打Silverlight(3) - 2.0控件之Border, Button, Calendar, Canvas, CheckBox, Co