HTML5 Canvas遇到的几个小问题

HTML5 Canvas遇到的几个问题

        最近在一个项目中尝试通过Hybrid的方式开发客户端程序，来尽量降低由于程序业务逻辑或者显示界面的改变而来的升级困扰。Hybrid的方式就是本地代码和HTML5应用相结合的方式，其中本地代码负责和底层的硬件打交道，通过WebView提供的接口将硬件数据传递给运行其中HTML页面。这种方式很适合既要和硬件打交道，客户端业务逻辑页面也不是太复杂的应用。当然这篇文章不是讲Hybrid，而是在实现HTML页面时遇到Canvas的问题。

         1. height、width和style.height、style.width

         在之前开发的页面中，一般都是通过CSS来控制页面上元素的尺寸。刚开始使用Canvas时，也采用了同样的方式，可是结果却出人意料。代码如下：

var context = document.getElement('canvas1').getContext('2d');var width = $('#canvas').attr('width');$('#canvas1').attr('width',0);$('#canvas1').attr('width',width);context.clearRect(0, 0, width, $('#canvas1').attr('height'));