2016-04-01から1ヶ月間の記事一覧

Canvasで網目模様を描く方法を教えてください。その5の派生

地球のテクスチャーマッピング。 基本的なところを勉強中。 マウスで操作できるのだが、イベントハンドラあたりを書き直した。 こちらは問題ないのだが、その5に適用すると球体の反対側を表にしたとき動作が逆になる。 あぁ〜時間がほしい。また忙しくなる…

Canvasで網目模様を描く方法を教えてください。その5

マウスのドラッグにより球体の回転を行えるように改良した。 しかし、動作がおかしい <meta charset="UTF-8"> <title>3D</title> <style> canvas { background : #000; } </style> <body> <canvas width="1024" height="700"></canvas> <script> (function () { function CanvasController (canvas) { this.canvas = canvas; this.mouseX = 0; this…</body></meta>

種市は、桜満開(喜利屋さんで撮影)

CANVASで網目模様を描く方法を教えて下さい.その4

面の明るさを計算できるようにした。 面の法線ベクトルを調べ、平行光源とのベクトルの角度を抽出して明るさを調べる。 もう高速化には限度がありそうなので、オブジェクト指向っぽく書き直すかな。 (プログラムが読みづらい) <meta charset="UTF-8"> <title>3D</title> <style> canvas { background :</style></meta>…

CANVASで網目模様を描く方法を教えて下さい.その3

動かしてみたら、球体と回転にミスがあることが判明。 OKWave にも投稿したし、これで安眠できる。めでたし、めでたし。 <meta charset="UTF-8"> <title>3D</title> <style> canvas { background : #fff; } </style> <body> <canvas width="1024" height="512"></canvas> <script> function ball (r, n, n1) { var rst = [], a = [], b = [], c = []; var pi = M…</body></meta>

CANVASで網目模様を描く方法を教えて下さい.その2

ここまでやったなら、「俺流」といえるかもしれない。 <meta charset="UTF-8"> <title>3D</title> <style> canvas { background : #ddd; } </style> <body> <canvas width="1024" height="512"></canvas> <script> function prism (r, h, n, n1) { var i, j, k, x, y, yn, z; var rst = [], top = [], btm = [], b = [0], c = [r]; v…</body></meta>