2012年9月5日

在HTML5的Canvas上绘制椭圆的几种方法

摘要： 概述 html5中的Canvas并没有直接提供绘制椭圆的方法，下面是对几种绘制方法的总结。各种方法各有优缺，视情况选用。各方法的参数相同：context为Canvas的2D绘图环境对象，x为椭圆中心横坐标，y为椭圆中心纵坐标，a为椭圆横半轴长，b为椭圆纵半轴长。 参数方程法 该方法利用椭圆的参数方程来绘制椭圆//-----------用参数方程绘制椭圆---------------------//函数的参数x,y为椭圆中心；a,b分别为椭圆横半轴、//纵半轴长度，不可同时为0//该方法的缺点是，当linWidth较宽，椭圆较扁时//椭圆内部长轴端较为尖锐，不平滑，效率较低function Pa 阅读全文

posted @ 2012-09-05 15:15 djy_fn 阅读(313) 评论(0) 推荐(0) 编辑

使用quadraticCurveTo绘制二次贝赛尔曲线

摘要： Canvas提供了一系列的方法来绘制曲线，比如quadraticCurveTo(通过起始两个点以及一个控制点来绘制，前两个参数为控制点横纵坐标，后两个参数为终点横纵坐标，使用的是数学上的二次贝赛尔方程)。下面我们来看一下常见的一些使用。固定控制点 如下程序，我们实现了一个固定起始点，使用鼠标位置做为控制点，来绘制二次贝赛尔曲线的应用：<!doctype html><html> <head> <meta charset="utf-8"> <title>Canvas</title> </head> 阅读全文

posted @ 2012-09-05 14:34 djy_fn 阅读(518) 评论(0) 推荐(0) 编辑

导航