P5球体遊び

気晴らしに作ったもの。
マウスの座標に応じて文字が球体の周りを回転するものです。

コードは下記。
球体の周りのテキストには、任意のRSSフィードを引っ張ってきて遊ぶのも良いかと思います。

PFont myFont;
int rad = 100;
int theta = 0;

void setup() {
size(600, 600, P3D);
myFont = loadFont("Georgia-48.vlw");
textFont(myFont, random(20,32));

}

void draw() {

String[] msg = new String[13];

for(int num = 0; num < msg.length; num++){
msg[num] = "message"+num;
}

background(225);
//stroke(255, 50);
noStroke();
lights();

translate(300, 300, 0);
rotateX(mouseY * 0.05);
rotateY(mouseX * 0.05);
fill(230, 230, 230);
//sphereDetail(mouseX / 4);
sphere(100);

for(int i=0; i< msg.length;i++){
theta = 30*i;
rotateX(PI/3.0);

if(i%3==0){
//text(msg[i],100+10*i,100+10*i,100+10*i);

fill(0, 102, 153,100);
text(msg[i],rad*cos(theta),rad*sin(theta),100+10*i);

}else if(i%3==1){

fill(102,102,255,100);
text(msg[i],rad*cos(theta),-rad*sin(theta),100+10*i);

}else{

fill(153,0,51,100);
text(msg[i],rad*cos(theta),rad*sin(theta),100+10*i);

}
}

}

proce55ingとWordle

wordleはタグクラウドを簡便に作成可能なWebサービス。

下記画像はSocialBookmarkサービスのDeliciousで保存したタグを
一覧表示したものです。

ブラウザ画面上でテキストのフォント、カラー、配置を調整できるので、
遊んでみると面白いかも。







































ProcessingからもWordleを扱うライブラリ”wordookie”があります。
※JRE ver.1.6以上で動作するようで、MacOSXの人はJava Preferencesを開いてJavaの実行環境を要調整。

参考動画はリンク先のもの。




およその使用法はサンプルに沿って下記。

import wordookie.*;

static String FONT = "MingLiU";

//フォントの最大値、最小値を設定
static final float MAX_FONT_SIZE = 100f;
static final float MIN_FONT_SIZE = 12f;

//テキストで表示するカラー群を格納
static color [] TEXT_COLORS = { #F6EFF7, #BDC9E1, #67A9CF, #02818A };
color BACKGROUND_COLOR = color( 0 );

//表示するテキストを格納
static String [] wordInput = { "Hello",
"Guten Tag",
"\u3053\u3093\u306b\u3061\u306f" , //日本語の“こんにちは”
"Buenos Dias",
"Bonjour",
"Buon Giorno",
"\u4f60\u597d" }; //中国語の“你好”

java.util.List wordList;

int wordIndex = 0;
PFont font;
Layout layout;

void setup()
{
size( 1024, 768 );
smooth();
frameRate( 30 );

font = createFont( FONT, 48 );

// load words
this.loadWords();

// sort words by weight, decreasing
this.sortWords();

layout = new Layout( this, BACKGROUND_COLOR );

background( 0 );
}

void draw()
{
…
・wordListに含まれる各要素を取り出してフォント、カラー設定
・wordListの各要素のフォントの大きさ、表示テキストの配置を設定

これを動かすと画像のように、ウィンドウ上に表示されます。