尝试将图像加载到 html5 画布上，然后使用 Phonegap 在 Android 上运行 html5。这是我的 HTML。
<!DOCTYPE HTML>
<html>
<body>
<canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
var img=new Image()
img.src="img_flwr.png"
cxt.drawImage(img,0,0);
</script>
<img src="img_flwr.png"/>
</body>
</html>
我已经包含了标准 img 标签来演示该问题。
在 Firefox 下，此页面正确显示在画布上和标准 img 标签中渲染的图像。
当我使用Phonegap部署到Android模拟器时，只有标准img显示图片。
html 和 .png 文件都位于我的phonegap 项目的assets/www 文件夹中。
如何使图像在画布上正确渲染？
编辑..已修复（感谢 Avinash）.. 这一切都与时间有关.. 您需要等到 img 加载后才能绘制到画布上 ..vis
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
var img=new Image()
img.src="img_flwr.png";
img.onload = function() {
cxt.drawImage(img,0,0);
};
这可能是加载图像的延迟（这只是我的猜测，我不确定。如果它有帮助，我会很高兴）...
尝试这个代码（等待页面完全加载）
<!DOCTYPE HTML>
<html>
<body>
<canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>
<script type="text/javascript">
window.onload = function() {
var c=document.getElementById('myCanvas');
var cxt=c.getContext('2d');
var img=new Image();
img.src='img_flwr.png';
cxt.drawImage(img,0,0);
};
</script>
<img src="img_flwr.png"/>
</body>
</html>
或者您可以在加载图像后执行以下操作
var c=document.getElementById('myCanvas');
var cxt=c.getContext('2d');
var img=new Image();
img.onload = function() {
cxt.drawImage(img,0,0);
};
img.src='img_flwr.png';
如果问题仍然存在，请告诉我...
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
