Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Matrix digital rain http://jsbin.com/ORIpOxi/
# Preview: http://jsbin.com/bijag
c = document.getElementById('c')
ctx = c.getContext('2d')
# full screen
c.height = window.innerHeight
c.width = window.innerWidth
letters = "".split("")
font_size = 20
columns = c.width/font_size
drops = (1 for x in [0..columns])
# drawing the characters
draw = ->
# black BG for the canvas
ctx.fillStyle = "rgba(214,0, 0, 0.0520)"
ctx.fillRect(0,0,c.width,c.height)
ctx.fillStyle = "pink"
ctx.font = "20pt Android"
# looping over drops
for i in [0..drops.length]
letter = letters[Math.floor(Math.random() * letters.length)]
ctx.fillText(letter, i * font_size, drops[i] * font_size)
if (drops[i] * font_size > c.height and Math.random() > 0.99)
drops[i] = 0
drops[i] = drops[i] + 1
setInterval(draw, 100/2.14)
# Forked from http://jsbin.com/IDIgUL/8
letters = "ɒdɔbɘʇǫʜiႱʞlmnoqpɿƨƚƚuvwxyzAᙠƆᗡƎᖷᎮHIᐴႱᐴ⅃MИOꟼỌЯƧTUVWXYƸ1234567890アイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤユヨラリルレロワヰヱヲンッ".split("")
c = document.getElementById('c')
ctx = c.getContext('2d')
c.height = window.innerHeight
c.width = window.innerWidth
font_size = 10
columns = c.width/font_size
drops = (1 for x in [0..columns])
# drawing the characters
draw = ->
# black BG for the canvas
ctx.fillStyle = "rgba(0,0,0,0.05)"
ctx.fillRect(0,0,c.width,c.height)
ctx.fillStyle = "green"
ctx.font = font_size + "px"
# looping over drops
for i in [0..drops.length]
letter = letters[Math.floor(Math.random() * letters.length)]
ctx.fillText(letter, i * font_size, drops[i] * font_size)
if (drops[i] * font_size > c.height and Math.random() > 0.99)
drops[i] = 0
drops[i] = drops[i] + 1
setInterval(draw, 1000/24)
/* basic reset */
* {margin: 0; padding: 0;}
/* adding a black bg to the body to make things clearer */
body {background: black;}
canvas {display: block;}
<!DOCTYPE html>
<html>
<head>
<title>JS Bin</title>
</head>
<body>
<canvas id="c"></canvas>
</body>
</html>
@josephok
Copy link

josephok commented Aug 1, 2014

coffee真是美妙。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment