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

落書きノート

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

CG

HTML CSS JavaScriptでCG作成

まあ、パターンが決まりつつありますが、乱数の使い方によっては少し作品の印象が変わるなと思いました。2枚目の写真はfor文のパラメータをいじった結果です。 <html> <head> <title>Canvas tutorial template</title> <script type="text/javascript"> function draw() { var canvas = document.getElementById('tutori</head></html>…

HTML CSS JavaScriptでCG作成

これで最後ですかね。この次から「ジェネラティブアート」を少しずつ不定期に読んでいこうかと思ってます。 <html lang="ja"> <head> <meta charset="utf-8" /> <title>Canvas Tutorial Template</title> <script type="text/javascript"> var PI_2 = Math.PI * 2; var canvasW = 640; var canvasH = 480; var numMovers = 600; var friction = .96; var m</meta></head></html>…

HTML CSS JavaScriptでCG作成

面白かったので講座の続きを。ここで少し疲れたかな。 <html lang="ja"> <head> <meta charset="utf-8" /> <title>Canvas Tutorial Template</title> <script type="text/javascript"> const NUM = 500; const WIDTH = 640; const HEIGHT = 480; var speedX = new Array(NUM); var speedY = new Array(NUM); var locX = new Array(NU…</meta></head></html>

HTML CSS JavaScriptでCG作成

講座を見て自分でやってみました。乱数便利! <html> <head> <title>Canvas tutorial template</title> <script type="text/javascript"> function draw() { var canvas = document.getElementById('tutorial'); if (canvas.getContext) { var ctx = canvas.getContext('2d'); ctx.globalAlpha = 0.3; for (i = 0; i < 1</head></html>…

HTML CSS JavaScriptでCG作成

VSCode,汎用的に使えるのは良いですが、インデントの挙動がおかしいとかがあって、まだところどころバグがあるんじゃないのかと思うのですが…。試しにAdobe提供のBracketsを使ってみると便利に使えたのでこちらを使ってみてます。Google Chromeでないとライ…

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'); ctx.fillRect(50,50,300,200); ctx.clearRect(120,80,200,140); ctx.strokeRect(</head></html>…

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

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

DirectX9 基本的な座標変換を行うプログラム

参考書から抜粋しています。DirectX9について以前投稿した記事の続きです。マトリックスをコードに落とし込んでいきます。 何もしないマトリックス まず、何もしないマトリックスを使って、各種のマトリックスを生成し、レンダリングパイプラインに適用する…

DirectX9 3Dモデルの表示とマテリアル適用

頂点バッファを使って表示する方法もありますが、複雑なモデルを表示するときには3Dモデリングソフトを使ってXファイルを作り、プログラムからそのファイルを読み込むようにすることが一般的です。 まずは、Xファイルを読み込む方法について載せます。Xファ…

画像デザインの投稿 初発

MacOSでGimpを使い、画像編集、デザインをしてみることにしました。1〜2日につき1回のペースで考えてます。機能は一通り把握してはいても、実際に公開できるようなデザインの画像を作ったことがないので、最初は下手なものが多いと思いますが、このブログを…

C/C++ DirectX9 環境設定のメモ 備忘録

DirectX9のサンプルファイルをよく試すのでその設定方法を簡単に自分用にメモします。環境はVisual Studio 2015 Community Edition,DirectX9 SDK… x86とx64があるが、確認程度ならどちらでも構わないと思います。x86版で設定していきます。 ビルドするときに…

C/C++ DirectX9 頂点シェーダ 座標系 3Dオブジェクトの表示

さて、今回はオブジェクトの表示をしただけです。サンプルプロジェクトを用意し、ビルドしただけです。DirectX9の座標系は、左手座標系です。その他のOpenGLとかでは右手座標系を使っている場合があるようです。環境によって違うということですね。 頂点デー…

「Processingをはじめよう」を読了

3D機能、画像出力、PDF出力のプログラムを試しました。後はArduinoがありましたが、別の参考書で読んだので、抜かしました。なお、画像出力とPDF出力はここには載せていません。

オライリー Processingをはじめよう オブジェクト、配列を使ったプログラム

どんどん載せていきますね。 そろそろ終わりですね。

オライリー Processingをはじめよう その3

今回はこんな感じです。

オライリー Processingをはじめよう その2

今日試したプログラムはこんな感じです。スクリーンショットにプログラムが書いてあります。 フレームレートのおかげでアニメーションが滑らかに見えます。図形(パックマン)の移動、乱数、乱数を使って画面外に出ないための制約を付加、sin波とcos波を使っ…

オライリー Processingをはじめよう その1

「Processingをはじめよう」を読んでいる最中です。プログラムでCGを表現する方法が載っています。Processingというプログラミング言語を使っています。 本当はプログラムを載せると見やすいのですが、インタラクティブにコードを記述して実行させている時に…

VC++ DirectX9 基本的な設定と三次元シーンの構築と描画

まずはDirectXGraphicsの初期化から入る。 // レンダラーオブジェクト Renderer renderer; // レンダラーの初期化 HRESULT hr; hr = renderer.Initialize(hWnd, isFullScreen, CLIENT_WIDTH, CLIENT_HEIGHT); if(FAILED(hr)) { return 0; // 初期化失敗 } Re…

C/C++ WinAPI DirectX9 クライアント領域の計算

DirectXの積み本を消化しようと思って読んでいます。バージョンが9のため、少々古い情報となりますが、このバージョンも未だに現役で使われています。 まずはサンプルコードでビルド出来るかどうかを確認していました。ちょっと端折って書きます。 今回検証…

Processing マウス機能を使ったスケッチ

とりあえずはこんな感じ。 void setup() { size(400, 400); stroke(255); background(192, 64, 0); } void draw() { line(150, 25, mouseX, mouseY); } 次は背景色の上書きで以下のようになる。 void setup(){ size(400, 400); stroke(255); } void draw(){ …