雑多なブログ

音楽や語学、プログラム関連の話題について書いています

トップ > canvas

canvas

MDN web docsのCanvasでブロック崩しを作るチュートリアルが良い感じ

javascript Canvas

みんな大好きMDNのサイトに、Canvasの独習に良さげなチュートリアルがありましたので紹介します。内容がシンプルにまとまっているので、サクッとCanavsを学べるのでおすすめです。 developer.mozilla.org

Canvasの画像のピクセルデータの書き込み

Canvas js

Canvasでピクセルデータを取り扱う場合は、ImageDataオブジェクトを使用していろいろな操作を行います。 Canvasのピクセルデータは次の通り 1ピクセルは、width x height x 4byte のデータがあります。 4byteは何の情報かというと、下記の色の情報を持ってい…

Canvasの練習で時計を作ってみた。

js canvas

めちゃくちゃしょぼいけど、とりあえずCanvasの練習で時計らしきものを作ってみた。 <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>時計</title> <script> var ctx; function init() { ctx = document.getElementById("graph").getContext('2d'); paint(); set…</meta></meta></head></html>