HTMLCanvas-CSDN博客

原创 bigengineer.js - 金海龙HTML5 Canvas 作图函数库 2012版

/* 名称：金海龙HTML5 Canvas 作图函数库 2012版版本：2.0 作者：金海龙(高级软件工程师) 博客：http://htmlcanvas.webgarden.com Google搜索：HTML Canvas 金海龙类型：Web应用/绘图/源代码开发平台：WinXP+Google浏览器功能：为个人开发者提供简单的作图函数，凡是支持HTML5的浏览器

2012-08-13 15:05:42 1996

原创在网页上画一个点(HTML5 Canvas作图)

从这篇文章开始，你们会看到权威的HTML5 Canvas作图技术，下面是相关图片：画布上有一点p(19,82)，在JavaScript中表示？可以用以下方式： var p=new Array(2); p[0]=19; p[1]=82; 这一点也能被作为“绘图函数的参数”，看下面的内容： function DrawP(Canvas,P) { //在点P处画一个点 w

2012-08-13 15:00:41 1979

原创在网页上画一条线段(HTML5 Canvas作图)

由于HTML5提供的画线段函数太麻烦，所以需要封装一下： function DrawLine(Canvas,A,B) { //画一条线段,“A、B”是这条线段的端点 with (Canvas) { moveTo(A[0],A[1]); lineTo(B[0],B[1]); } } 把这个函数写进“bigengineer.js”中。下面是更多的实例，这些例子都很有代

2012-08-13 14:56:33 1059

原创在网页上画一个矩形(HTML5 Canvas作图)

简化作图步骤，重写作图函数： function DrawRect(Canvas,A,C) { //画个矩形,“A、C”是对顶点 var p1,p2=new Array(2); p1=GetSmallest(A,C); p2=GetBiggest(A,C); with (Canvas) { rect(p1[0],p1[1],p2[0]-p1[0],p2[1]-p1[1]);

2012-08-13 14:53:31 1088

原创在网页上画一个三角形(HTML5 Canvas作图)

简化作图步骤，重写作图函数(画一个三角形)： function DrawTriangle(Canvas,A,B,C) { //画个三角形,“A、B、C”是顶点 with (Canvas) { moveTo(A[0],A[1]); lineTo(B[0],B[1]); lineTo(C[0],C[1]); lineTo(A[0],A[1]); } } 把这个函

2012-08-13 14:49:54 1578

原创画正圆角矩形 - HTML5 Canvas 作图

function DrawRoundRect(Canvas,P1,P2,Radius) 功能：画正圆角矩形参数：P1：矩形左上角坐标；P2：矩形右下角坐标； Radius：圆角大小源代码： function DrawRoundRect(Canvas,P1,P2,Radius) { //画个圆角矩形 var A=new Array(Math.min(P1[0],P2[0]

2012-08-13 14:47:27 1671

原创画圆角 - HTML5 Canvas 作图

2、function DrawAOBArc(Canvas,A,O,B,Radius) 功能：画圆角参数：Radius：圆角的大小；A，B：边上两点；源代码： function DrawAOBArc(Canvas,A,O,B,Radius) { //画圆角 /* example: var A=new Array(50,50); var O=new Array(50,15

2012-08-13 14:44:50 723

原创画椭圆 - HTML5 Canvas 作图

8、function DrawEllipse(Canvas,O,OA,OB) 功能：画椭圆参数：O：椭圆中心的坐标； OA，OB：长轴、短轴的长度源代码： function DrawEllipse(Canvas,O,OA,OB) { //画椭圆，例子：var B=new Array(150,150); DrawEllipse(hb,B,50,30); with (

2012-08-13 14:41:41 8032

原创画闭合的多边形 - HTML5 Canvas 作图

10、function DrawPolygon(Canvas,P) 功能：画闭合的多边形参数：P是一个包含各个顶点坐标的数组实例： bigengineer.js"> var c=document.getElementById("cc"); var hb=c.getContext("2d"); var P=new Array(12); P[0]=10; P[

2012-08-13 14:35:29 1481

原创画段弧线 - HTML5 Canvas 作图

6、function DrawArc(Canvas,O,Radius,startAngle, endAngle, anticlockwise) 功能：画段弧线参数：startAngle:起始角度； endAngle：终止角度； anticlockwise：是否按照逆时针方向画弧；源代码： function DrawArc(Canvas,O,Radius,startAn

2012-08-13 14:30:16 823

原创 Google搜索：HTML5 金海龙

想找到我，记得Google搜索！博客地址没必要记忆！ Google一下，总能找到我！我喜欢你们Google搜索：.net 金海龙本站有关于HTML5 Canvas的技术文章都可以在国际网站“http://htmlcanvas.webgarden.com”上找到！由于国内欠缺HTML5 Canvas作图技术，我写了些原创技术文章，发表在我的国

2012-08-04 11:47:49 872

AI编程集团金蝉脱壳的博客