Skip to content

Instantly share code, notes, and snippets.

@ethertank

ethertank/README.md

Last active August 29, 2015 14:05
Show Gist options
  • Save ethertank/e3bb18a54dbbed1eaaa1 to your computer and use it in GitHub Desktop.
Save ethertank/e3bb18a54dbbed1eaaa1 to your computer and use it in GitHub Desktop.
Download ZIP
Hello, bl.ocks.org
Raw
README.md 
https://gist.github.com/ethertank/e3bb18a54dbbed1eaaa1
     http://bl.ocks.org/ethertank/e3bb18a54dbbed1eaaa1
     http://bl.ocks.org/ethertank/raw/e3bb18a54dbbed1eaaa1
Raw
css.css
@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
.noto,
.noto > pre,
.noto > code,
.noto > var {
font-family: "noto sans japanese", sans-serif;
}
.yugothic,
.yugothic > pre,
.yugothic > code,
.yugothic > var {
font-family: "yu gothic", sans-serif;
}
.meiryo,
.meiryo > pre,
.meiryo > code,
.meiryo > var {
font-family: meiryo, sans-serif;
}
Raw
index.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<title>Hello, bl.ocks.org</title>
<link rel="stylesheet" href="css.css"></link>
<script src="js.js"></script>
</head>
<body>
<h1>Hello, bl.ocks.org.</h1>
<figure class="noto">
<figcaption>Noto Sans Japanese</figcaption>
<pre>
あいうえおかきくけこさしすせそたちつてとなにぬねの
はひふへほまみむめもやゐゆゑよらりるれろわをん
</pre>
</figure>
<figure class="yugothic">
<figcaption>游ゴシック</figcaption>
<pre>
あいうえおかきくけこさしすせそたちつてとなにぬねの
はひふへほまみむめもやゐゆゑよらりるれろわをん
</pre>
</figure>
<figure class="meiryo">
<figcaption>メイリオ</figcaption>
<pre>
あいうえおかきくけこさしすせそたちつてとなにぬねの
はひふへほまみむめもやゐゆゑよらりるれろわをん
</pre>
</figure>
<figure>
<canvas id="canvas1" width="300" height="300">
<p>canvas を用いたデモ。特に意味のあるものは描画していない。</p>
</canvas>
</figure>
</body>
</html>
Raw
js.js
window.addEventListener("load", windowLoaded, false);
function windowLoaded () {
var canvas = document.getElementById("canvas1");
var ctx = canvas.getContext("2d");
ctx.fillRect(0, 0, 300, 300);
ctx.fillStyle="#fff";
ctx.fillRect(100, 100, 100, 100);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment