Rysowanie w canvas - problem z wymiarami

Rysowanie w canvas - problem z wymiarami

pioncz Zobacz profil	6.12.2012, 15:33:57 Post #1
Grupa: Zarejestrowani Postów: 8 Pomógł: 0 Dołączył: 24.12.2010 Ostrzeżenie: (0%)	Witam, Od niedawna próbuję swoich sił z rysowaniem na elemencie canvas i wpadłem na problem, którego nie mogę rozwiązać. Kiedy rysuję za pomocą np fillrect(x,y, width, height) to parametry width i height zależą od rozmiaru elementu canvas. Chciałem zrobić aplikację wyświetlającą się w całym oknie przeglądarki i przy zmianie rozmiaru okna, element canvas też zmienia swoje wymiary. Oto przykładowy kod z moim problemem, wyświetlane elementu w myCanvas i myCanvas2 powinny mieć teoretycznie takie same wymiary: [HTML] pobierz, plaintext <html xmlns="http://www.w3.org/1999/xhtml"> <head> <script type="text/javascript"> function draw() { var canvas = document.getElementById('myCanvas'); var ctx = canvas.getContext('2d'); ctx.fillStyle = '#00f'; ctx.fillRect (0, 0,100, 100); var canvas2 = document.getElementById('myCanvas2'); var ctx2 = canvas2.getContext('2d'); ctx2.fillStyle = '#0f0'; ctx2.fillRect (0, 0, 100, 100); } </script> </head> <body onLoad="draw();"> <canvas id="myCanvas" style="background:black;width:500px;height:500px;display:block;position:absolute;t op:0px;left:0px;"> </canvas> <canvas id="myCanvas2" style="background:purple;width:100px;height:100px;display:block;position:absolute; top:0px;left:0px;"> </canvas> </body> </html> [HTML] pobierz, plaintext