OpenGL Spectrum, Only One Point Visible

  • (3 Pages)
  • +
  • 1
  • 2
  • 3

31 Replies - 1732 Views - Last Post: 21 March 2013 - 10:48 PM Rate Topic: -----

#1 EndLessMind  Icon User is offline

  • These are the droids you're looking for
  • member icon

Reputation: 194
  • View blog
  • Posts: 1,099
  • Joined: 13-March 09

OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 01:57 AM

Hi. I know that my problem is not a game development problem, but it is a OpenGL ES problem.
I made some visual effect to visualizer audio on a Android-device, but i was rendering it in a canvas, so the performance was very low. So i was thinking that i could make it in OpelGL ES, so that i can use the GPU to render, and not the CPU on the device.
So far, so good.
Got to the point where i've calculated the lines values from the Waveform data and was going to render the lines.
I was not really sure how to do that, and google did not tell me much, and the only result i get is this:
Attached Image

This is how i create the surface
	public void surfaceCreated(GL10 gl) {
		// TODO Auto-generated method stub
		gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT);
		gl.glLoadIdentity();
		gl.glTranslatef(0.0f, 0.0f, -5.0f);
	    gl.glShadeModel(GL10.GL_SMOOTH);

	    gl.glClearDepthf(1.0f);

	    gl.glEnable(GL10.GL_DEPTH_TEST);

	    gl.glDepthFunc(GL10.GL_LEQUAL);

	    gl.glHint(GL10.GL_PERSPECTIVE_CORRECTION_HINT, 
	                      GL10.GL_NICEST);
	}


And this is where i calculate the points and render them to the SurfaceView
	@Override
	public void onPreRender(GL10 gl, AudioData data) {
		// TODO Auto-generated method stub
		 if (mPoints == null || mPoints.length < data.bytes.length * 4) {
		        mPoints = new float[data.bytes.length * 4];
		      }
		 // Calculate points for line
		 if (mPoints != null) {
	    for (int i = 0; i < data.bytes.length - 1; i++) {
	      mPoints[i * 6] = view.getWidth() * i / (data.bytes.length - 1);
	      mPoints[i * 6 + 1] = view.getHeight() / 2 + ((byte) (data.bytes[i] + 128)) * (view.getHeight() / 3) / 128;
	      mPoints[i * 6 + 2] = 0;
	      mPoints[i * 6 + 3] = view.getWidth() * (i + 1) / (data.bytes.length - 1);
	      mPoints[i * 6 + 4] = view.getHeight() / 2 + ((byte) (data.bytes[i + 1] + 128)) * (view.getHeight() / 3) / 128;
	      mPoints[i * 6 + 5] = 0;
	    }
	    Render(gl);
		 }
	}
	

public void Render(GL10 gl) {
		
	ByteBuffer vertexByteBuffer = ByteBuffer.allocateDirect(mPoints.length * 4);
	vertexByteBuffer.order(ByteOrder.nativeOrder());
	vertexBuffer = vertexByteBuffer.asFloatBuffer();
	vertexBuffer.put(mPoints);
	vertexBuffer.position(0);
	
		gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
		// set the colour for the background
		gl.glClearColor(0.7f, 0.1f, 0.6f, 0.2f);
		
		// to show the color (paint the screen) we need to clear the color buffer
		gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
		
		// set the colour for the triangle
		gl.glColor4f(0.0f, 1.0f, 0.0f, 0.5f);
		//gl.glDisable(gl.GL_TEXTURE_2D);
		// Point to our vertex buffer
		gl.glVertexPointer(3, GL10.GL_FLOAT, 0, vertexBuffer);

		// Draw the vertices as triangle strip
		gl.glDrawArrays(GL10.GL_LINE_STRIP, 0, mPoints.length / 3);
		
		
		//Disable the client state before leaving
		gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
	}


I know that i calculations are fine, because i use them in an app where i get this result (on canvas)
Attached Image

This is the first time i'm working with OpelGL, so i've probably made alot of mistakes.

If there is any questions about the code or my problem, please ask.
Really hope someone can help me with this.

Thanks in advance

Is This A Good Question/Topic? 0
  • +

Replies To: OpenGL Spectrum, Only One Point Visible

#2 anonymous26  Icon User is offline

  • D.I.C Lover

Reputation: 0
  • View blog
  • Posts: 3,638
  • Joined: 26-November 10

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 09:37 AM

When stuff like this happens in OpenGL it is normally because your vertices are being read incorrectly. If you have

for (int i = 0; i < data.bytes.length - 1; i++)



how do you know that

mPoints[i * 6 + 3]



is guaranteed to be in bounds or even correct for all cases. Yes, it might crash if it goes out-of-bounds, but failing that you'll get undefined results like what you are seeing.

You need code to verify these bounds.

Your code for drawing the vertices looks a like something is missing too, I would have expected to see some matrix pushing and popping depending on how your objects are drawn for instance.
Was This Post Helpful? 0
  • +
  • -

#3 EndLessMind  Icon User is offline

  • These are the droids you're looking for
  • member icon

Reputation: 194
  • View blog
  • Posts: 1,099
  • Joined: 13-March 09

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 11:42 AM

View PostButchDean, on 20 March 2013 - 04:37 PM, said:

When stuff like this happens in OpenGL it is normally because your vertices are being read incorrectly. If you have

for (int i = 0; i < data.bytes.length - 1; i++)



how do you know that

mPoints[i * 6 + 3]



is guaranteed to be in bounds or even correct for all cases. Yes, it might crash if it goes out-of-bounds, but failing that you'll get undefined results like what you are seeing.

You need code to verify these bounds.

Your code for drawing the vertices looks a like something is missing too, I would have expected to see some matrix pushing and popping depending on how your objects are drawn for instance.


The incoming WaveForm data is always 1024 bytes, when i pass in the data the code looks like this:
	public void setAudioData(AudioData data) {
		 if (mPoints == null || mPoints.length < data.bytes.length * 6) {
		        mPoints = new float[data.bytes.length * 6];
		      }
	}


So the array ( mPoints ) is created to hold 6144 (1024 bytes, 3 dimensions, 2 vertices per line) pieces of data (zero-based index)


And how come i only see one line?
It moved according to the music, but there should be and end to that line.
Do i need to move the camera back?
Was This Post Helpful? 0
  • +
  • -

#4 anonymous26  Icon User is offline

  • D.I.C Lover

Reputation: 0
  • View blog
  • Posts: 3,638
  • Joined: 26-November 10

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 11:57 AM

I'm not a big fan of magic numbers. You should define '6' somewhere as a final int and use that.

Moving the camera back, who knows. The reason why you are only seeing one line is because there is an error in there that you are not catching. Investigate glGetError().
Was This Post Helpful? 0
  • +
  • -

#5 EndLessMind  Icon User is offline

  • These are the droids you're looking for
  • member icon

Reputation: 194
  • View blog
  • Posts: 1,099
  • Joined: 13-March 09

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 12:29 PM

Okey.

glGetError() returns "0"

I'm not really sure where to go from here.
Was This Post Helpful? 0
  • +
  • -

#6 anonymous26  Icon User is offline

  • D.I.C Lover

Reputation: 0
  • View blog
  • Posts: 3,638
  • Joined: 26-November 10

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 12:33 PM

Where did you put it in the code? I was expecting it in multiple places, not just once. You need to read up on how to use it properly.
Was This Post Helpful? 0
  • +
  • -

#7 EndLessMind  Icon User is offline

  • These are the droids you're looking for
  • member icon

Reputation: 194
  • View blog
  • Posts: 1,099
  • Joined: 13-March 09

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 12:40 PM

I put it everywhere.
Everytime i made a call to GL10, like so
		gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
		Log.d("TAAFFAAFA", gl.glGetError() + "");
		// set the colour for the background
		gl.glClearColor(0.7f, 0.1f, 0.6f, 0.2f);
		Log.d("TAAFFAAFA", gl.glGetError() + "");
		// to show the color (paint the screen) we need to clear the color buffer
		gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
		Log.d("TAAFFAAFA", gl.glGetError() + "");
		// set the colour for the triangle
		gl.glColor4f(0.0f, 1.0f, 0.0f, 0.5f);
		//gl.glDisable(gl.GL_TEXTURE_2D);
		// Point to our vertex buffer
		gl.glVertexPointer(3, GL10.GL_FLOAT, 0, vertexBuffer);
		Log.d("TAAFFAAFA", gl.glGetError() + "");
		// Draw the vertices as triangle strip
		gl.glDrawArrays(GL10.GL_LINE_STRIP, 0, mPoints.length / 3);
		Log.d("TAAFFAAFA", gl.glGetError() + "");
		
		//Disable the client state before leaving
		gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
		Log.d("TAAFFAAFA", gl.glGetError() + "");


But it only prints "0"

That not the only place i've put it, but just an example.
Was This Post Helpful? 0
  • +
  • -

#8 EndLessMind  Icon User is offline

  • These are the droids you're looking for
  • member icon

Reputation: 194
  • View blog
  • Posts: 1,099
  • Joined: 13-March 09

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 01:31 PM

So. I've tried to make it even more simple.
So, this is what i've got now (in code)

MainActivity
import android.opengl.GLSurfaceView;
import android.os.Bundle;
import android.app.Activity;

public class MainActivity extends Activity {

	BasicRenderer myRend;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
	    GLSurfaceView glView = (GLSurfaceView)findViewById(R.id.GLView);
	    myRend =new BasicRenderer(this,glView);
	    glView.setRenderer(myRend);
	}

}


and the renderer
import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.FloatBuffer;

import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;

import android.content.Context;
import android.media.MediaPlayer;
import android.media.audiofx.Visualizer;
import android.opengl.GLSurfaceView;
import android.opengl.GLU;
import android.opengl.GLSurfaceView.Renderer;
import android.util.Log;

public class BasicRenderer implements Renderer {

private Context mContext;
private float mWidth, mHeight;
private Visualizer mVisualizer;
private byte[] mBytes;
private byte[] mFFTBytes;
protected FloatBuffer vertexBuffer;
protected float[] mPoints;
private GLSurfaceView view;

public BasicRenderer(Context context , GLSurfaceView mView){
    mContext=context;
    view = mView;
    link(new MediaPlayer());
}

@Override
public void onDrawFrame(GL10 gl) {
    gl.glClear(GL10.GL_COLOR_BUFFER_BIT | 
            GL10.GL_DEPTH_BUFFER_BIT);
    Log.d("Error", gl.glGetError() + "");

    if (mBytes != null) {
    	if (mPoints == null || mPoints.length < mBytes.length * 6) {
	        mPoints = new float[mBytes.length * 6];
	      }
	 // Calculate points for line
	 if (mPoints != null) {
    for (int i = 0; i < mBytes.length - 1; i++) {
      mPoints[i * 6] = view.getWidth() * i / (mBytes.length - 1);
      mPoints[i * 6 + 1] = view.getHeight() / 2 + ((byte) (mBytes[i] + 128)) * (view.getHeight() / 3) / 128;
      mPoints[i * 6 + 2] = 0;
      mPoints[i * 6 + 3] = view.getWidth() * (i + 1) / (mBytes.length - 1);
      mPoints[i * 6 + 4] = view.getHeight() / 2 + ((byte) (mBytes[i + 1] + 128)) * (view.getHeight() / 3) / 128;
      mPoints[i * 6 + 5] = 0;
    }
    draw(gl);
	 }
    }

}


public void draw(GL10 gl) {
	
	ByteBuffer vertexByteBuffer = ByteBuffer.allocateDirect(mPoints.length * 4);
	vertexByteBuffer.order(ByteOrder.nativeOrder());
	vertexBuffer = vertexByteBuffer.asFloatBuffer();
	vertexBuffer.put(mPoints);
	vertexBuffer.position(0);
	
		gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
		Log.d("Error", gl.glGetError() + "");
		
		// set the colour for the background
		gl.glClearColor(1f, 1f, 1f, 0.5f); 
		Log.d("Error", gl.glGetError() + "");
		
		// to show the color (paint the screen) we need to clear the color buffer
		gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
		Log.d("Error", gl.glGetError() + "");
		
		// set the colour for the triangle
		gl.glColor4f(0.0f, 1.0f, 0.0f, 0.5f);
		Log.d("Error", gl.glGetError() + "");
		//gl.glDisable(gl.GL_TEXTURE_2D);
		
		// Point to our vertex buffer
		gl.glVertexPointer(3, GL10.GL_FLOAT, 0, vertexBuffer);
		Log.d("Error", gl.glGetError() + "");
		
		// Draw the vertices as triangle strip
		gl.glDrawArrays(GL10.GL_LINE_STRIP, 0, mPoints.length / 3);
		Log.d("Error", gl.glGetError() + "");
		
		
		//Disable the client state before leaving
		gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
		Log.d("Error", gl.glGetError() + "");
	}

@Override
public void onSurfaceChanged(GL10 gl, int width, int height) {
    mWidth = (float)width; 
    mHeight = (float)height;

    gl.glViewport(0, 0, width, height);
    Log.d("Error", gl.glGetError() + "");
    
    gl.glMatrixMode(GL10.GL_PROJECTION);
    Log.d("Error", gl.glGetError() + "");
    
    gl.glLoadIdentity();
    Log.d("Error", gl.glGetError() + "");
    
    GLU.gluPerspective(gl, 45.0f,
                               (float) width / (float) height,
                               0.1f, 100.0f);
    Log.d("Error", gl.glGetError() + "");
    
    gl.glMatrixMode(GL10.GL_MODELVIEW);
    Log.d("Error", gl.glGetError() + "");
    
    gl.glLoadIdentity();
    Log.d("Error", gl.glGetError() + "");
}

@Override
public void onSurfaceCreated(GL10 gl, EGLConfig config) {

    // Set the background color to white
    gl.glClearColor(1f, 1f, 1f, 0.5f); 
    Log.d("Error", gl.glGetError() + "");
    
    gl.glShadeModel(GL10.GL_SMOOTH);
    Log.d("Error", gl.glGetError() + "");
    
    gl.glClearDepthf(1.0f);
    Log.d("Error", gl.glGetError() + "");
    
    gl.glEnable(GL10.GL_DEPTH_TEST);
    Log.d("Error", gl.glGetError() + "");
    
    gl.glDepthFunc(GL10.GL_LEQUAL);
    Log.d("Error", gl.glGetError() + "");
    
    gl.glHint(GL10.GL_PERSPECTIVE_CORRECTION_HINT, GL10.GL_NICEST);
    Log.d("Error", gl.glGetError() + "");
}


/**
* Links the visualizer to a player
* @param player - MediaPlayer instance to link to
*/
  public void link(MediaPlayer player)
  {
    if(player == null)
    {
      throw new NullPointerException("Cannot link to null MediaPlayer");
    }

    // Create the Visualizer object and attach it to our media player.
   // mVisualizer = new Visualizer(player.getAudioSessionId());
    mVisualizer = new Visualizer(0);
    //isReleased = false;
    mVisualizer.setEnabled(false);
    mVisualizer.setCaptureSize(Visualizer.getCaptureSizeRange()[1]);

    // Pass through Visualizer data to VisualizerView
    Visualizer.OnDataCaptureListener captureListener = new Visualizer.OnDataCaptureListener()
    {
      public void onWaveFormDataCapture(Visualizer visualizer, byte[] bytes,
          int samplingRate)
      {
    	   mBytes = bytes;
    	 
      }

      public void onFftDataCapture(Visualizer visualizer, byte[] bytes,
          int samplingRate)
      {
    	  mFFTBytes = bytes;
      }
    };
    mVisualizer.setDataCaptureListener(captureListener,
        15000, true, true);

    // Enabled Visualizer and disable when we're done with the stream
    mVisualizer.setEnabled(true);

  }


}



But still the same result.
Was This Post Helpful? 0
  • +
  • -

#9 anonymous26  Icon User is offline

  • D.I.C Lover

Reputation: 0
  • View blog
  • Posts: 3,638
  • Joined: 26-November 10

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 02:12 PM

How much OpenGL experience do you have?
Was This Post Helpful? 0
  • +
  • -

#10 EndLessMind  Icon User is offline

  • These are the droids you're looking for
  • member icon

Reputation: 194
  • View blog
  • Posts: 1,099
  • Joined: 13-March 09

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 02:14 PM

This is all new for me. So basically non :/
Was This Post Helpful? 0
  • +
  • -

#11 anonymous26  Icon User is offline

  • D.I.C Lover

Reputation: 0
  • View blog
  • Posts: 3,638
  • Joined: 26-November 10

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 02:48 PM

Okay, well you need to start from the basics. :)
Was This Post Helpful? 0
  • +
  • -

#12 EndLessMind  Icon User is offline

  • These are the droids you're looking for
  • member icon

Reputation: 194
  • View blog
  • Posts: 1,099
  • Joined: 13-March 09

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 02:55 PM

I thought i did that.
This is what i've read:

OpenGL ES with Android Tutorial- Switching from Canvas to OpenGL

OpenGL ES Tutorial for Android Part I Setting up the view

OpenGL ES for Android Graphics Programming

and my code now i based on this

Buttons, OpenGL, and Renderers - Android

I can't find anything about how to render lines like this :/
Was This Post Helpful? 0
  • +
  • -

#13 anonymous26  Icon User is offline

  • D.I.C Lover

Reputation: 0
  • View blog
  • Posts: 3,638
  • Joined: 26-November 10

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 02:58 PM

I'm talking real basics, like NeHe's tutorials.
Was This Post Helpful? 0
  • +
  • -

#14 EndLessMind  Icon User is offline

  • These are the droids you're looking for
  • member icon

Reputation: 194
  • View blog
  • Posts: 1,099
  • Joined: 13-March 09

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 03:21 PM

That tutorial as actually more confusing, mostly because i don't know object-c


How about this one?
First Experience with OpenGL ES2 on Android
Was This Post Helpful? 0
  • +
  • -

#15 anonymous26  Icon User is offline

  • D.I.C Lover

Reputation: 0
  • View blog
  • Posts: 3,638
  • Joined: 26-November 10

Re: OpenGL Spectrum, Only One Point Visible

Posted 20 March 2013 - 03:45 PM

No, I mean NeHe's regular OpenGL tutorials for Windows.
Was This Post Helpful? 0
  • +
  • -

  • (3 Pages)
  • +
  • 1
  • 2
  • 3