読者です 読者をやめる 読者になる 読者になる

落書きノート

ふと自分が気になった事を書いてます

HTML CSS JavaScriptを使ってCG作品を作る

今日は山中まで親と一緒に車で喫茶店に行ってきました。丸太で作られたような店で、そこでコーヒーを。森林浴をしながらコーヒーを飲むかのような。ハンモックもあってゆったり出来るスペースもありましたね。まあ、色々見て疲れたので、今日はOpenGLとクリエイティブコーディングの一部分だけやって終わりにします。

HTMLとCSS,JavaScriptを使ってインタラクティブなCG作品を作るための準備だけやりました。

<html>

<head>
  <title>canvas tutorial</title>
  <script type="text/javascript">
    function draw() {
      var canvas = document.getElementById('tutorial');
      if (canvas.getContext) {
        var ctx = canvas.getContext('2d');
      }
    }
  </script>
  <style type="text/css">
    canvas {
      border: 1px solid #999;
    }
  </style>
</head>

<body onload="draw();">
  <canvas id="tutorial" width="400" height="300"></canvas>
</body>

</html>

f:id:kh2n:20170515012346p:plain

これより先の方を見てると、結構面白いものが作れるようです。地味な言語のプログラムですけど、出来る作品は結構派手です。Processingも割りと地味な方だったか。笑

追記

テキストエディタはVSCodeを使ってます。アドオンはView in Browserを。フォーマッタはデフォルトのものを使ってます。Emacsでは不便だったので。笑