给excanvas添加fillText方法

在http://ck-2036.iteye.com/blog/800897 的基础上修改了一下 支持文本换行粗体斜体

因为IE8和IE8之前的版本不知道html5.所以excanvas能做一些矢量图的处理。
以下是编辑文字

contextPrototype.measureText = function(textToDraw) {
var hiddenSpan = document.createElement('span');
hiddenSpan.style.font = this.font;
hiddenSpan.innerHTML = textToDraw.replace(/\r\s/g, "<BR>");
var row = hiddenSpan.innerHTML.split("<BR>").length;
var bodyNode = document.getElementsByTagName("body")[0];
bodyNode.appendChild(hiddenSpan);
var width = hiddenSpan.offsetWidth;
var height = hiddenSpan.offsetHeight;
bodyNode.removeChild(hiddenSpan);
return {"width" : width + row, "height" : height + row};
};
contextPrototype.fillText = function(textToDraw, x, y) {
var vmlStr = [];
var measure = this.measureText(textToDraw);
textToDraw = textToDraw.replace(/\r\s/g, "<br>");
vmlStr.push('<g_vml_:shape style="font:' + this.font + ';',
' color:' + this.fillStyle + ';',
' position:absolute;',
' left:' + x + 'px;',
' top:' + y + 'px;',
' width:' + measure.width + 'px;',
' height:' + measure.height + 'px;"',
' ><g_vml_:textbox inset="0,0,0,0">' + textToDraw,
' </g_vml_:textbox>',
'</g_vml_:shape>');
this.element_.insertAdjacentHTML('BeforeEnd', vmlStr.join(''));
};
有问题发我邮箱louxiaoling@126.com
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值