html5绘制草,html5 canvas海底水草动画

html5 canvas海底水草动画

代码片段：

Stem.prototype.draw = function(ctx) {

var len, ctrlPoint, point;

len = this.points.length - 1;

ctrlPoint = {x: 0, y: 0};

ctx.save();

ctx.strokeStyle = this.color;

ctx.beginPath();

ctx.moveTo(this.points[this.points.length - 1].x, this.points[this.points.length - 1].y);

for (var i = len; i >= 1; i--) {

point = this.points[i];

ctrlPoint.x = (point.x + this.points[i - 1].x) / 2;

ctrlPoint.y = (point.y + this.points[i - 1].y) / 2;

ctx.quadraticCurveTo(point.x, point.y, ctrlPoint.x, ctrlPoint.y);

ctx.lineWidth = i * 1.1;

ctx.stroke();

ctx.fillStyle = 'red';

}

ctx.restore();

}

申明：本站所有资源都是转载各大下载站，或由网友投稿发布，请自行检测软件的完整性，如有侵权请联系我们删除下架，联系方式：admin@php.cn