2017-06-09 15 views
1

私はテクスチャ(img)を、アクティブな波形の場合のみ表示させようとしています。しかし、これまでのところ私の試みは失敗しました。私は頂点の使い方をあまり理解していませんでした。処理中、オーディオ波形内のテクスチャを使用

PImage img; 
import ddf.minim.*; 

Minim minim; 
AudioPlayer song; 

void setup() 
{ 
    size(800, 600,P2D); 
    minim = new Minim(this); 
    song = minim.loadFile("song.mp3"); 
    song.play(); 
    img = loadImage("img.jpg"); 
} 

void draw() 
{ 
    background(0); 
    stroke(255); 
    for (int i = 0; i < song.bufferSize() - 1; i++) 
    { 
    beginShape(); 
    texture(img); 
    vertex(0,height/2); 
    vertex(i, height-100 - song.right.get(i)*50); 
    vertex(i+1, height-100 - song.right.get(i+1)*50); 
    vertex(width,height/2); 
    vertex(0,height/2); 
    vertex(0,height/2+100); 
    endShape(); 
    } 
} 

答えて

1

あなたはほとんどそこにいる:

  • あなたがXを渡しているしている、あなたは、テクスチャマッピングにV座標のuを渡していません
  • 形状をレンダリングする頂点位置のyの値

vertex()参照に必ずお読みください:

この関数は、テクスチャをジオメトリにマップするためにも使用されます。 texture()関数はジオメトリに適用するテクスチャを宣言し、uおよびv座標セットはこのテクスチャのフォームへのマッピングを定義します。デフォルトでは、uとvに使用される座標は画像のサイズ(ピクセル単位)に対して指定されますが、この関係はtextureMode()で変更できます。

PImage img; 
import ddf.minim.*; 

Minim minim; 
AudioPlayer song; 

void setup() 
{ 
    size(800, 600,P2D); 
    noStroke(); 
    minim = new Minim(this); 
    song = minim.loadFile("song.mp3"); 
    song.play(); 
    img = loadImage("img.jpg"); 
} 

void draw() 
{ 
    background(0); 
    stroke(255); 
    for (int i = 0; i < song.bufferSize() - 1; i++) 
    { 
    beginShape(); 
    texture(img); 
    vertex(0,height/2,          //vertex 0,x,y 
      0,height/2);          //vertex 0,u,v 
    vertex(i, height-100 - song.right.get(i)*50,    //vertex 1,x,y 
      i, height-100 - song.right.get(i)*50);    //vertex 1,u,v 
    vertex(i+1, height-100 - song.right.get(i+1)*50,   //vertex 2,x,y 
      i+1, height-100 - song.right.get(i+1)*50);   //vertex 2,u,v 
    vertex(width,height/2,         //vertex 3,x,y 
      width,height/2);         //vertex 3,u,v 
    vertex(0,height/2,          //vertex 4,x,y 
      0,height/2);          //vertex 4,u,v 
    vertex(0,height/2+100,         //vertex 5,x,y 
      0,height/2+100);         //vertex 5,u,v 
    endShape(); 
    } 
} 

vは同様に(だけではなくvertex(x,y);使用vertex(x,y,u,v);の)座標、yはuの座標として、それはあなたが描くしようとしているどのような形状は不明だが、あなたができる1つの単純なことは、xを渡しています

テストされていませんが、コメントによって違いがわかります。それは、頂点1のテクスチャ座標をコントロールとしてあなたは、マウスを動かすと、テクスチャが歪むか

PImage img; 
void setup(){ 
    size(100,100,P2D); 
    //make a texture 
    img = createImage(50,50,RGB); 
    for(int i = 0 ; i < img.pixels.length; i++) { 
    int x = i % img.width; 
    int y = i/img.height; 
    if(x % 4 == 0 && y % 4 == 0){ 
     img.pixels[i] = color(255); 
    }else{ 
     img.pixels[i] = color(0); 
    } 
    } 
    img.updatePixels(); 
} 
void draw(){ 
    background(0); 
    //sampling different u,v coordinates (vertex 1 is mapped to mouse) for same x,y 
    beginShape(); 
    texture(img); 
    vertex(0,0,0,0); 
    vertex(50,0,mouseX,mouseY); 
    vertex(50,50,50,50); 
    vertex(0,50,0,50); 
    endShape(); 

    text("u:"+mouseX+"v:"+mouseY,5,height); 

    translate(50,0); 
    //mapping u,v to x,y coordinates 
    beginShape(); 
    texture(img); 
    vertex(0,0,0,0); 
    vertex(50,0,50,0); 
    vertex(50,50,50,50); 
    vertex(0,50,0,50); 
    endShape(); 

} 

お知らせ:

はここで()をテクスチャと頂点を()を使用しての超基本的な例です。頂点(x、y、u、v)は頂点(x、y)と非常に似ていますが、頂点がスクリーン上にレンダリングされる座標に加えて、テクスチャのサンプリング先の座標も制御できます。

uv mapping vertex demo preview

基準述べたように、デフォルトtextureMode()によってUを意味し、画像であり、V座標が(0,0からテクスチャ画像の幅、高さ)の画像座標です。使用可能な別のモードは次のとおりです。u、vサンプリング座標が0.0〜1.0の間で正規化されたNORMALは、3Dアプリケーションで検出されたものに近いものです。UV mapping機能

+0

削除した後、ストローク、それは正常に働いた:)私はビデオでテクスチャを配置し、オーディオ入力としてマイクを持って、あなたが話す必要があるビデオを見ることができるように:) – PoYo

関連する問題