javascript - canvas中的fillText在IE8和更早版本中比例失调
迷茫
迷茫 2017-04-11 13:12:45
[JavaScript讨论组]

使用canvas在IE下绘制折线图,因为要支持IE8以及更早版本,所以引用了html5.js和excanvas.js两个库。
当使用fillText方法在canvas中添加文本的时候,在IE8以上版本中正常显示,但是在IE8以及更早版本中却发生了错位。
正常显示图、错误显示图如末尾的图所示。
其中增加文字的代码如下:

//填写X轴信息(周一、周二等)
this.ctx.beginPath();
for( var i=0,ptindex;i< data.values[key]["value"+key].length;i++ ){
    ptindex = i+1;
    var x_x = this.getCoordX(padding,perwidth,ptindex);
    var x_y = can.height-padding+30;
    console.log("x_x is "+x_x);
    console.log("x_y is "+x_y);
    this.ctx.fillText(data.values[key]["value"+key][i].x, x_x-20, x_y, perwidth);
}
for(var i=0;i< ycount/10;i++)
{
    this.ctx.fillText(i*10, padding-30, (ycount/10-i)*10*maxY, perwidth);
}

利用console.log打印出来的用于定位text位置的 x_x、x_y 如末尾的图所示。
其中canvas的定义以及css属性定义如下:

 

迷茫
迷茫

业精于勤,荒于嬉;行成于思,毁于随。

全部回复(1)
阿神

看到题目我就点进来。 参考网址 http://nannan408.iteye.com/bl...

我们公司的做法是 低版本ie 独立模板渲染。只保留基础功能

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号