Processing.js

この言語はすでにハブにありましたが、投稿はProcessing自体に当てられていました。多くの人がProcessing.jsについて読むことに興味があると思います。

Processing.jsは、移植されたJavaScript処理言語であるオープンソースのWeb視覚化プログラミング言語です。 Processing.jsは、アニメーションにJsを使用し、canvasタグを使用して画像を処理します。 すぐにこのアプローチの特定のマイナスに気付くことができます。IEには特に友好的ではありません。Microsoftの声明によると、彼らは将来Canvasタグをサポートしません。 いずれにせよ、8人は仕事を拒否した。 実装構文は、Java構文に非常に似ています。

主なものについて簡単に説明すると、視覚化は、次のようなものを定義するセットアップ関数の説明から始まります。

画像サイズ(サイズ(x、y、)

1秒あたりのフレーム数(frameRate(x));

他のパラメーター、たとえば、プリミティブを描画するときに使用される線の太さや色など。

次に、draw()関数が定義されます。これは、スクリプトが完了するまでループで常に呼び出されます。

mouseover onclickイベントなどによって呼び出されるメソッドも説明できます。

これがすべて行われたという事実に基づいて、グラフィック効果に対しては非常にスマートに機能しますが、もちろん彼はJavaの親のパフォーマンスからはほど遠いです。

構文の例(タスクがこのタイプのアプリケーションの開発を可能な限り簡単にすることであった場合、私の意見では99%を管理しました):

int currentFrame = 0;

PImage[] frames = new PImage[12];

int lastTime = 0;



void setup()

{

size(200, 200);

strokeWeight(4);

smooth();

background(204);

for ( int i = 0; i < frames.length; i++) {

frames[i] = get (); // Create a blank frame

}

}



void draw()

{

int currentTime = millis();

if (currentTime > lastTime+100) {

nextFrame();

lastTime = currentTime;

}

if (mousePressed == true ) {

line(pmouseX, pmouseY, mouseX, mouseY);

}

}



void nextFrame()

{

frames[currentFrame] = get (); // Get the display window

currentFrame++; // Increment to next frame

if (currentFrame >= frames.length) {

currentFrame = 0;

}

image(frames[currentFrame], 0, 0);

}




* This source code was highlighted with Source Code Highlighter .








仕事の例



例1

例2

例3

例4

私のお気に入りのフラクタル1

私のお気に入りのフラクタル2

私のお気に入りのフラクタル3



ユニバーサルに関するUPD



非常に理解しやすい形式の言語リファレンスはここにあります。



All Articles