共计 894 个字符，预计需要花费 3 分钟才能阅读完成。
* 将文本绘制到 canvas 的中间
*/
this.drawTextInCenter = function (text, fill)
{
var point = this.caculateTextCenterPos(text);
if (fill)
{
context.fillText(text, point.x, point.y);
}
else
{
context.strokeText(text, point.x, point.y);
}
};
/**
设置画笔宽度
@param newWidth
@returns {*}
*/
this.penWidth = function (newWidth)
{
if (arguments.length)
{
context.lineWidth = newWidth;
return this;
}
return context.lineWidth;
};
/**
设置画笔颜色
@param newColor
@returns {*}
*/
this.penColor = function (newColor)
{
if (arguments.length)
{
context.strokeStyle = newColor;
context.fillStyle = newColor;
return this;
}
return context.strokeStyle;
};
/**
设置字体大小
@param fontSize
@returns {*}
*/
this.fontSize = function (fontSize)
{
if (arguments.length)
{
context.font = fontSize“px Verdana, Geneva, sans-serif”;
return this;
}
return context.fontSize;
}
}
这个类也就对 Canvas 对象进行了简单的封装，设置参数，绘制图形什么的，比较简单，大家可以完善下这个类~
3、GuaGuaLe.js
/**
*/
function GuaGuaLe(idFront, idBack)
{
this.$eleBack = $(“#”idBack);
this.$el
原文地址: HTML5 CSS3 诱人的实例：canvas 模拟实现电子彩票刮刮乐
