console 命令行工具 X clear

console

var pi = "3.1415926535897932384626433832795028841971693993751058209749445923078164062862089986280348253421170679821480865132823066470938446095505822317253594081284811174502841027019385211055596446229489549303819644288109756659334461284756482337867831652712019091456485669234603486104543266482133936072602491412737245870066063155881748815209209628292540917153643678925903600113305305488204665213841469519415116094330572703657595919530921861173819326117931051185480744623799627495673518857527248912279381830119491298336733624406566430860213949463952247371907021798609437027705392171762931767523846748184676694051320005681271452635608277857713427577896091736371787214684409012249534301465495853710507922796892589235420199561121290219608640344181598136297747713099605187072113499999983729780499510597317328160963185950244594553469083026425223082533446850352619311881710100031378387528865875332083814206171776691473035982534904287554687311595628638823537875937519577818577805321712268066130019278766111959092164201989"
var list = document.getElementById("list");

function getColor(n) {
    if (n == 0) return "firebrick";
    if (n == 1) return "chocolate";
    if (n == 2) return "goldenrod";
    if (n == 3) return "khaki";
    if (n == 4) return "springgreen";
    if (n == 5) return "turquoise";
    if (n == 6) return "royalblue";
    if (n == 7) return "orchid";
    if (n == 8) return "deeppink";
    if (n == 9) return "sienna";
}

for (var i = 0; i < pi.length; i++) {
    var n = pi[i];
    if (n != '.') {
        var block = document.createElement("li");
        block.style.backgroundColor = getColor(n);
        block.title = n;
        list.appendChild(block);
    }
}

<html>

<head></head>

<body>
    <div class='container'>
        <header>
            <h1>Pi Visualization</h1>
            <p>The blocks below display the first 1001 digits of Pi (π) in sequential order from left to right, top to bottom.</p>
        </header>
        <ul id='list'></ul>
    </div>
</body>

</html>

@import url(http://fonts.googleapis.com/css?family=Noto+Sans:400,700);
* {
    margin: 0;
    padding: 0;
}
body {
    background-color: #333;
}
.container {
    width: 500px;
    margin: 0 auto;
}
header {
    padding: 32px 0;
    font-family: Noto Sans, sans;
    color: #ddd;
}
header h1 {
    margin-bottom: 8px;
    font-size: 28px;
}
header p {
    font-size: 18px;
}
ul {
    list-style: none;
}
ul li {
    display: block;
    height: 20px;
    width: 20px;
    float: left;
}