NO IMAGE 未分類

hiroyukitsuda.com から htsuda.net にドメインを変更した際の作業の流れ。

さくらのコントロールパネルで新しいドメインを追加する。 お名前.com で htsuda.net にさくらのネームサーバーの値を設定する(ns1.dns.ne.jpみたいなやつ)。 さくらのコントロールパネルでhtsuda.net ...
NO IMAGE improc

ヒストグラムマッチングによる画像の平均輝度とコントラストの調整

作成した関数 hist.match = function( cimg, target.hist = NULL, return.image = T, save.dir = "NULL" ){ if( !is.null( ...
NO IMAGE improc

自然画像中の方位の分布の解析

人間は水平・垂直な方向の線分に対して感度が高いことが知られており、これは Oblique effect と呼ばれます。人間が生活する視環境の中に水平・垂直の成分が多く含まれることがこのような視覚特性をもたらしているという可能性が...
NO IMAGE improc

画像の背景色の除去

問題 物体画像のデータベースなどから得た画像は、多くの場合に物体の周囲に白い背景が付いています。実験では黒や灰色の画面に画像を提示することが多いので、画像をそのまま提示すると物体の周囲に余分な白色が出てしまいます(図の上段)。...
NO IMAGE improc

2値化画像とムーニー顔

二値化 これが何の画像か分かりますか? 正解はこちら。 心理学をやっている人ならこのダルメシアンの画像は何度も目にしていたことがあると思いますが、画像処理を使えばこの種の画像をいろいろと作ることができます。 ...
NO IMAGE improc

周波数フィルタリング

フーリエ変換 ローパスフィルタ・ハイパスフィルタ・バンドパスフィルタ library( imager ) clamp = function( array, min, max ){ ...
NO IMAGE improc

空間フィルタリングによる平滑化とエッジ検出

畳み込み処理 画素値を操作する際に、当該画素の周辺に存在する画素も用いて計算を行うことができます。例えば当該画素を含む周囲9ピクセルの画素値の平均を計算し、その値を当該画素の新しい画素値とする操作を行えば、画像をぼかす効果が得...
NO IMAGE improc

画像の輝度を調整する

画像の輝度を任意の値に合わせる方法を考えます。例えばある画像の平均輝度が 0.5 だとして、これを 0.3 など別の値になるように調整したい、ということです。 一見すると、この例の場合だと画像の全ピクセルの画素値を -0....
NO IMAGE improc

Rによる画像処理:imagerパッケージの使い方

Rで画像処理をするにあたって imager というパッケージを用います。このページでは imager の基本的な使い方について扱います。まず始めにデジタル画像について説明します。 デジタル画像について 私たちが普段パ...
NO IMAGE improc

画像処理と心理学

画像処理 (Image processing) とは、画像に対して何らかの処理を施すことです。 処理の結果(出力)として画像を得る場合もあれば、何らかの記述を得る場合もあります。前者の例としては写真の明るさやコントラストを調整して見栄...
NO IMAGE プログラミング

UE4で鏡を作る

やりたいこと 周囲の風景を反射する鏡を作りたい。 結果的には下記の画像のような平面的な鏡を作ります(風景に溶け込んで分かりにくいですが、四角い鏡が設置され周りの風景を映しています。 使用した...
NO IMAGE プログラミング

UE4でIBLのHDR天球画像を動的に変更する方法

やりたいこと UE4 で HDR 画像を使った IBL (Image-Based Lighting) において、天球画像をアプリ実行中に変更したい。 下の画像はスターターコンテンツの Advanced_Lighting ...
NO IMAGE プログラミング

UE4で変数の値をテキストファイルとして保存する方法

やりたいこと UE4 でブループリント変数の値をテキストファイルとして保存したい。 私の目的で言えば、アプリ実行中に得られたユーザーの行動データをテキストファイルとして保存したい、ということです(Unreal Engin...
NO IMAGE Tips

Savitzky–Golay filter を Processing on Eclipse で使う

やりたいこと ある時系列データ(下図のグレー)が与えられた時、それにフィルターをかけることで青線のようなスムージングされたデータにしたい。 やりかた Savitzky-Golay...
NO IMAGE プログラミング

Processingの自作ライブラリの作り方

Eclipse を使って Processing のユーザーライブラリを作成する方法を紹介します。 1. プロジェクトの新規作成 前回の記事のやり方に沿って既に Eclipse に Processing 本体のライブラ...
NO IMAGE プログラミング

Processing 3 を Eclipse で使う方法

Processing 3.0 を Eclipse で使えるようにする手順を説明します。 環境 - Mac OSX 10.10.1 - Eclipse Version: Luna Service Re...
NO IMAGE プログラミング

Unityで他のスクリプトの変数や関数を利用する

スクリプトから、他のスクリプトの変数や関数を利用したい場合があります。そのやり方について。 他のスクリプトが、同じゲームオブジェクトのコンポーネントである場合とそうでない(他のオブジェクトのコンポーネントである)場合とがあ...
NO IMAGE プログラミング

Unityでの空間移動用のスクリプト

Unityでプレイヤーが空間内を自由に移動や回転できるようにするスクリプトを紹介します。 (前置きですが)そもそも、三次元空間内における移動と回転は、3つの軸それぞれについて可能です。 図で説明すると以下のようです。 ...
NO IMAGE プログラミング

Rの変数をローカル環境からグローバル環境に割り当てる

Rでローカル変数をグローバル環境の変数にする方法について。 関数内で宣言された変数はその関数内でしか使えず、関数の実行が終わると利用できなくなります。 例えば以下のようなスクリプトを考えます。 # Main...
NO IMAGE プログラミング

Rでメイン関数を書く

Rでスクリプトを書く際に、CやJavaでのようにメイン関数を書きたいとします。 即ち、スクリプトの冒頭にメイン関数を配置し、その下にサブ関数を並べるというお馴染みの書き方をしたい。 結論から言えば、下記のように書けばOKです。 ...
NO IMAGE プログラミング

RStudio起動時に自動でスクリプトを実行

RStudioを起動した際に自動でスクリプトを実行させる方法について。 よく使う関数は自作関数としてまとめておきこれを読み込ませて使用するのが便利だと前回書きました。 毎回のスクリプトでこのような読み込みのための手続きを...
NO IMAGE プログラミング

Rの自作関数の読み込みと、RStudioのグローバル環境をクリアに保つ方法

Rの自作関数の読み込みと、読み込んだ関数をRStudioのグローバル環境に表示させない方法について。 前回紹介したような自作関数はスクリプト内に毎回記述するのではなく、自作関数をまとめておくための専用のRファイルを別に用意...
NO IMAGE プログラミング

RStudioのクリア関数

R を RStudio で使ってる際によく利用する各種のクリア関数についてまとめました。 1. コンソールの表示内容をクリアしたい時。 # Clear console messages cat( "\014...
NO IMAGE プログラミング

実行中のスクリプトファイルの所属ディレクトリの取得方法

実行中のスクリプトファイルがどのディレクトリに位置するかを取得する方法について。 スクリプトファイル中に以下のように書けば、そのスクリプトファイルが所属するディレクトリが取得できます。 # Get the d...
NO IMAGE P5

更新履歴

履歴 2014年11月27日 サーバーへのデータの保存 のページを作成。 2014年10月29日 ブラウザ上で動かす、作者/サイトの制作動機 のページを作成。 2014年9月23日 2AFC課題(...
NO IMAGE P5

サーバーへのデータの保存

jQuery/AjaxとPHPを用いてデータをサーバーに送信する。 var myp5 = new p5( function( sketch ) { var counter = 0; var response =...
NO IMAGE P5

作者/サイトの制作動機

このサイトの作者 津田裕之 詳しくは をご覧下さい。 このサイトを作った動機 素直な本心として。以下殴り書きの雑文で失礼します。 動機系列1 世の中に心理実験プログラミングについてきっちり書かれたウ...
NO IMAGE P5

このサイトの構成

このサイトの方針について Processing は(特にメディアアートや工学系において)最近人気の言語であるため、情報は比較的得やすいです。書籍は多く出ていますし、web上にも解説ページは多いです。勉強するための素材は十分あり、図形や...
NO IMAGE P5

このサイトの動作環境

閲覧環境 このサイトは Firefox と Chrome を用いて動作確認をしています。それ以外のブラウザ、例えば IE (Internet Explorer) などでは表示崩れなどが生じている可能性があります。また、モバイル端末...
NO IMAGE P5

ブラウザ上で動かす

Processing のコードをブラウザ上で動かす方法について。 Processing の js ライブラリを使う このサイト内では、プログラムコードの実行例を動画や画像ではなくブラウザ上で実際に動作させて表示してい...
NO IMAGE P5

Processingの利点と欠点

Processingを心理実験用の言語として使うことの利点と欠点について。 利点 インストール・文法・開発環境が平易である  導入コストが低い 簡潔な文法と描画APIを持つ  ラピッドプロトタイピン...
NO IMAGE P5

Processingとは

そもそも Processing って? Processing は Java をベースにしたプログラミング言語です。プログラミング初心者でも容易に習得可能な言語となるよう開発され、グラフィックや音を使ったプログラミングが手軽に作成できま...
NO IMAGE P5

2AFC課題(画像版)

課題内容 左右に提示される画像のうち、好きな方の画像をキーボードの矢印キー(左キー or 右キー)で回答する課題です。回答には制限時間があり、4秒以内に回答しないと次の試行に進みます。回答をするとその時点ですぐ次の試行が始まります...
NO IMAGE P5

text, PFont

文字を描画する text( 文字列, x, y ); 文字列を描画する  例:text( "Hello", 100, 100 ); // Helloという文字を座標(100, 100)に描画する textSize(...
NO IMAGE P5

透過色

色の不透明度を指定する fill 関数や stroke 関数で図形や線の色を指定する際に、引数を1つ付け足すと、その値は不透明度の値として使われます。不透明度を指定することで、透明な色を使うことができます。 fill...
NO IMAGE P5

アンチエイリアス : smooth, noSmooth

図形の輪郭の描画を滑らかにする smooth(); 図形の輪郭にアンチエイリアスをかける  例:smooth( 4 ); // 引数は 2, 4, 8 のいずれか  例:smooth(); // 引数を与えない場合は 2 が与...
NO IMAGE P5

面の色 : fill, noFill

図形の色を指定する fill( カラー値 ); 図形の色を指定する  例:fill( 128 ); // 灰色  例:fill( 0, 0, 255 ); // 青色 noFill(); 色を無くし、輪郭線のみで...
NO IMAGE P5

線の色と太さ : stroke, noStroke, strokeWeight

線や輪郭線の色や太さを変える stroke( カラー値 ); 線や図形の輪郭線の色を指定する  例:stroke( 128 ); // 灰色の線  例:stroke( 0, 0, 255 ); // 青色の線 ...
NO IMAGE P5

背景色 : background

背景色を指定する background 関数を使うことで画面の背景色を変えることができます。 background( グレースケール値 );  グレースケール値で背景色が指定されます。  例:background...
NO IMAGE P5

カラーモード : colorMode

Processing における色の表現方法 色を指定する方法(カラーモード)には次の4つがあります。 グレースケールモード  1つの数値を使い、黒から白までの明るさを、256段階の間で指定するモードです。  0で...
NO IMAGE P5

複雑な形 : beginShape, endShape

beginShape, endShape beginShape と endShape という2つの命令の間に頂点の座標を任意の数だけ指定することで、それらを結んだ図形を描くことができます。 サンプル var s...
NO IMAGE P5

曲線 : curve, bezier

シンタックス:curve curve( c1x, c1y, x1, y1, x2, y2, c2x, c2y )  C1とC2を制御点とする、(x1, y1)と(x2, y2)を通る曲線を引く サンプル va...
NO IMAGE P5

基本図形 : rect, triangle, quad, ellipse, arc

シンタックス rect( X座標, Y座標, 幅, 高さ ) 長方形を描く triangle( X1, Y1, X2, Y2, X3, Y3 ) 三角形を描く quad( X1, Y1, X2, Y2, X3, Y3, X4,...
NO IMAGE P5

点と直線 : point, line

シンタックス point( X座標, Y座標 ) line( 始点のX, 始点のY, 終点のX, 終点のY ) サンプル var swidth = 600; var sheight = 400; ...
NO IMAGE P5

反応時間の取得

概要 反応時間を計測するサンプルコードです。 緑色の円が表示されたらキーボードのキーをどれでもいいので押して下さい(zキーとか)。 押されたキーのキー番号と、円が出てからキーが押されるまでの時間(RT)が画面左上に表示されます...
NO IMAGE P5

p5.jsテスト

簡単なコードを用いてこの2つの関数の挙動を確認してみましょう。 var myp5 = new p5( function( sketch ) { var counter = 0; var response = ;...
NO IMAGE P5

ウィンドウを開く : size

size 関数 size 関数を使って、プログラムの実行時に開かれるウィンドウをサイズを指定して開くことができます。 void setup(){ size( 600, 400 ); // 横幅600px, 縦幅...
NO IMAGE P5

関数の利用

関数 Processing における関数の作り方は以下のようになります。 戻り値のデータ型 関数名(引数){ ここに関数内の処理を書く } 具体例を示します。 void setup(...
NO IMAGE P5

setupとdraw

初期化関数とメインループ関数 Processing を使ったプログラミングでは、初期化関数( setup 関数)とメインループ関数( draw 関数)という2つの関数を使ってプログラムコードを構成するというスタイルが一般的に行なわ...
NO IMAGE P5

三項演算子

三項演算子 三項演算子 ? を使うことで、if else 文のような条件分岐を簡潔に記述できます。 color c; background( 245 ); colorMode( HSB, 100 ); noSt...