function intersection(ax1,ay1,ax2,ay2,bx1,by1,bx2,by2){//true есть пересечение иначе false
var v1,v2,v3,v4;
v1=(bx2-bx1)*(ay1-by1)-(by2-by1)*(ax1-bx1);
v2=(bx2-bx1)*(ay2-by1)-(by2-by1)*(ax2-bx1);
v3=(ax2-ax1)*(by1-ay1)-(ay2-ay1)*(bx1-ax1);
v4=(ax2-ax1)*(by2-ay1)-(ay2-ay1)*(bx2-ax1);
return (v1*v2<0) && (v3*v4<0);
}tmxJSON.drawTiles(); который отрисовывает тайл карту и если она у тебя на весь канвас то clearRect вообще не нужен так как она и так все перекрывает, (fillRect не пойму зачем вызываешь). Я попробовал у меня ничего не лагает все норм. Может ты вызываешь tmxJSON.load('firstTiledMap.json'); в методе update, ну тогда понятно почему лагает у тебя 60 раз в секунду загружает карту, (ну по крайней мере пытается ее загрузить). И еще если в геймлупе(update) используешь setTimeout или не дай бог setInerval, поменяй на requestAnimationFrame.
//ctx.drawImage(img,0,0,ctxW,ctxH - offset); и закоментируйctx.fillRect(0,0,ctxW,ctxH - offset);Uncaught SecurityError: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data.
var canvas, ctxW = 500, ctxH = 500,ctx;
window.onload = function(){
canvas = document.createElement("canvas");
canvas.width = ctxW;
canvas.height = ctxH;
document.body.appendChild(canvas);
ctx = canvas.getContext("2d");
handler();
}
function handler () {
ctx.clearRect(0,0,ctxW,ctxH);
//Тут вызов функций и прочие реализации
setTimeout(handler,1000/60);
}function Game(canv_width,canv_height){
//set the canvas attributes
this.width=canv_width,
this.height=canv_height,
//create canvas elements
this.canvas=document.createElement("CANVAS"),
//set canvas width
this.canvas.width=this.width,
//set canvas height
this.canvas.height=this.height,
//push created <canvas> tag in <body>
document.body.appendChild(this.canvas),
//get the context
this.context=this.canvas.getContext('2d')
};
//Image object with draw function without else properties
//path-path to image file
function HImage(path){
//create new Image and set path to file
this.img=new Image();
this.img.src=path;
var _this = this;//Добавил тут кое-что
//flag of loading image
this.isLoad=false;
//when image is load
this.setToTrue=function(){
//set flag to true
this.isLoad=true;
},
this.img.onload=this.setToTrue();
//drawing image in position px,py. game_object - object of Game class
this.draw=function(game_object,px,py){
//if image is load
if (this.isLoad==true){
//draw the image in position
//game_object.context.fillStyle='#FFCCFF';
//game_object.context.fillRect(0,0,100,100);
game_object.context.drawImage(_this.img,px,py);//И тут заменил this На _this созданный ранее, так как в функции это не тот this о котором ты подумал
}
}
};
var game=new Game(800,600);
image=new HImage('http://facebookcovers.piz18.com/wp-content/uploads/2012/04/Audi-R8-Super-Car.jpg');
image.draw(game,200,200);