2010-09-04 はじめてのcanvas izuizu Follow 2010-09-04 15:35:14 License: MIT License Fork0 Fav0 View408 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 Tweet QR code Embed Design view Code view <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> zip tags Tweet twitter
