2010-09-04 はじめてのcanvas izuizu Follow 2010-09-04 15:35:14 License: MIT License Fork0 Fav0 View423 Play Stop Reload Fullscreen Smart Phone Readme JavaScript 38 lines HTML 2 lines CSS 0 lines 2010-09-04 はじめてのcanvas var izuizu = function() { var canvas = document.getElementById('izuizu'); if ( ! canvas || ! canvas.getContext ) { return false; } var ctx = canvas.getContext('2d'); ctx.fillStyle = "rgb(200, 0, 0)"; ctx.fillRect(0, 0, 500, 300); function izu(){ var r = Math.floor(Math.random() *256); var g = Math.floor(Math.random() *256); var b = Math.floor(Math.random() *256); ctx.fillStyle = "rgb("+r+","+g+", "+b+")"; ctx.beginPath(); var x = Math.random() *500; var y = Math.random() *300; var radius = Math.floor(Math.random() *30)+1; ctx.arc(x, y, radius, 0 , Math.PI *2, false); ctx.fill(); }; for (i = 0; i < 100; i = i +1){ izu(); }; }; window.onload = function() { window.setInterval(function(){ izuizu(); },1000); }; <h1>canvasやってみる</h1> <canvas width="500" height="300" id="izuizu"></canvas> 2010-09-04 はじめてのcanvas var izuizu = function() { var canvas = document.getElementById('izuizu'); if ( ! canvas || ! canvas.getContext ) { return false; } var ctx = canvas.getContext('2d'); ctx.fillStyle = "rgb(200, 0, 0)"; ctx.fillRect(0, 0, 500, 300); function izu(){ var r = Math.floor(Math.random() *256); var g = Math.floor(Math.random() *256); var b = Math.floor(Math.random() *256); ctx.fillStyle = "rgb("+r+","+g+", "+b+")"; ctx.beginPath(); var x = Math.random() *500; var y = Math.random() *300; var radius = Math.floor(Math.random() *30)+1; ctx.arc(x, y, radius, 0 , Math.PI *2, false); ctx.fill(); }; for (i = 0; i < 100; i = i +1){ izu(); }; }; window.onload = function() { window.setInterval(function(){ izuizu(); },1000); }; <h1>canvasやってみる</h1> <canvas width="500" height="300" id="izuizu"></canvas> use an iframe compat browser, deer Play on jsdo.it games Share Embed QR Tag Download Complete! Description どんなゲームですか？ Control Device スマートフォンコントローラー jsdo.it WebSocket Controller» マウス キーボード タッチデバイス Fullscreen 有効 無効 jsdo.it games から削除する Submit Tweet style Design view Code view code <script type="text/javascript" src="http://jsdo.it/blogparts/z8HJ/js?view=design"></script><p class="ttlBpJsdoit" style="width: 465px; margin: 0; text-align: right; font-size: 11px;"><a href="http://jsdo.it/izuizu/z8HJ" title="2010-09-04 はじめてのcanvas">2010-09-04 はじめてのcanvas - jsdo.it - share JavaScript, HTML5 and CSS</a></p> Tweet twitter
