doulu4203 2013-12-30 13:09
浏览 432
已采纳

更新canvas元素而不刷新页面

I have a question and I have been trying everything but just cant crack it. .I have set my HTML5 canvas up to send coordinates, objects etc to a database and then when that canvas is reloaded it (page refresh) it reloads all of the objects with the correct coordinates. .however what I'm trying to achieve is the canvas to update without page refresh every x seconds to show changes etc for example someone else adds something to the canvas everyone will see the change without page refresh so all users are seeing the same thing?

Thanks in advance for any help?

Okay im adding to this post, here is a simple code example of my problem, this all works fine and the var even updated fine when showing in the alert that I have put in however the canvas does now show the changes down below? all the getvars.php file is doing is echo 'Im coming from getvars scripts!';

`<!DOCTYPE html>
<html>
<head>
<style type="text/css">
body{ margin:10px; background:#666; }
#my_canvas{ background:#FFF; border:#000 1px solid; }
</style>
<script src='http://code.jquery.com/jquery-latest.js'></script>
<script>

$(function() {getStatus();});
function getStatus() {  
greg = $.ajax({
url: "getvars.php",
async: false
}).responseText;
setTimeout("getStatus()",10000);

function draw(){
var ctx = document.getElementById('my_canvas').getContext('2d');
ctx.fillStyle = 'black';
ctx.font = 'italic bold 60px Arial, sans-serif';
ctx.fillText(greg, 50, 50, 300);}   
window.alert(greg) 
window.onload = draw;}
</script>
</head>
<body>
<canvas id="my_canvas" width="500" height="350"></canvas>
</body>  
</html>`

is there something I need to add to make the canvas update as the alert is showing the var is updating from the getvars.php when I change it just the canvas stays the same? argh its driving me mad! Thanks in advance for any help you might be able to give?

  • 写回答

2条回答 默认 最新

  • donglao6169 2013-12-30 14:04
    关注

    Put your drawing code inside a .done handler on your jquery ajax call.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

悬赏问题

  • ¥15 怎么让wx群机器人发送音乐
  • ¥15 fesafe材料库问题
  • ¥35 beats蓝牙耳机怎么查看日志
  • ¥15 Fluent齿轮搅油
  • ¥15 八爪鱼爬数据为什么自己停了
  • ¥15 交替优化波束形成和ris反射角使保密速率最大化
  • ¥15 树莓派与pix飞控通信
  • ¥15 自动转发微信群信息到另外一个微信群
  • ¥15 outlook无法配置成功
  • ¥30 这是哪个作者做的宝宝起名网站