Team:OUC-China
From 2013.igem.org
(Difference between revisions)
Line 52: | Line 52: | ||
var canvas = document.querySelector('canvas'); | var canvas = document.querySelector('canvas'); | ||
var ctx = canvas.getContext('2d'); | var ctx = canvas.getContext('2d'); | ||
- | + | ||
var W = canvas.width = window.innerWidth; | var W = canvas.width = window.innerWidth; | ||
var H = canvas.height = window.innerHeight; | var H = canvas.height = window.innerHeight; | ||
- | + | ||
// Our SpaceShip Constructor | // Our SpaceShip Constructor | ||
var SpaceShip = function() { | var SpaceShip = function() { | ||
Line 114: | Line 114: | ||
ctx.strokeStyle = this.color; | ctx.strokeStyle = this.color; | ||
+ | ctx.fillStyle = this.color; | ||
// Setting a line width | // Setting a line width | ||
ctx.lineWidth = 15; | ctx.lineWidth = 15; | ||
Line 133: | Line 134: | ||
this.angle += this.rotation_speed; | this.angle += this.rotation_speed; | ||
ctx.rotate(this.angle); | ctx.rotate(this.angle); | ||
+ | |||
for (var i = 0; i < this.wing_count; i++) { | for (var i = 0; i < this.wing_count; i++) { | ||
Line 156: | Line 158: | ||
// A rounded body in the center | // A rounded body in the center | ||
ctx.beginPath(); | ctx.beginPath(); | ||
- | ctx.fillStyle = ' | + | ctx.fillStyle = '#5aaaff'; |
ctx.arc(this.x, this.y, 20, 0, Math.PI*2, false); | ctx.arc(this.x, this.y, 20, 0, Math.PI*2, false); | ||
ctx.fill(); | ctx.fill(); | ||
ctx.closePath(); | ctx.closePath(); | ||
- | |||
}; | }; | ||
}; | }; | ||
- | + | ||
// Create a spaceship object | // Create a spaceship object | ||
var ship = new SpaceShip(); | var ship = new SpaceShip(); | ||
Line 175: | Line 176: | ||
// Magik! We dont need so much speed though... | // Magik! We dont need so much speed though... | ||
ctx.clearRect(0,0,W,H); | ctx.clearRect(0,0,W,H); | ||
- | |||
ship.draw(ctx); | ship.draw(ctx); | ||
+ | // 在canvas上绘制标题文本 | ||
+ | // 字号为60px,字体为impact | ||
+ | ctx.font = "35px arial"; | ||
+ | // 将文本设为居中对齐 | ||
+ | ctx.textAlign = 'center'; | ||
+ | ctx.fillText("OUC-China is coming!", 669, 500); | ||
}()); | }()); | ||
}()); | }()); |
Revision as of 18:06, 27 July 2013