title: 3D Bar graph using OpenGLES in android
body: <p>I am creating a bar graph in android using opengl</p>
  <p>from an activity I'm calling the renderer and from the renderer I'm  calling a cube(im using cubes for showing the bars)</p>
  <p>Here is my renderer code:</p>
  <pre><code>public class BarRenderer implements Renderer {
  
  int[] vals;
  private float translatex, translatez, scaly;
  
  public BarRenderer(boolean useTranslucentBackground, int[] vals) {
      mTranslucentBackground = useTranslucentBackground;
      this.vals = vals;
      for (int i = 0; i &lt; this.vals.length; i++) {
          mcube[i] = new Cube();
      }
  }
  
  public void onDrawFrame(GL10 gl) {
      gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT);
      gl.glClearColor(0.0f, 0.5f, 0.5f, 1.0f);
      gl.glMatrixMode(GL10.GL_MODELVIEW);
      gl.glLoadIdentity();
      translatex = 0.5f;
      scaly = 0.8f;
      for (int i = 0; i &lt; vals.length; i++) {
          gl.glTranslatef((-1.0f + (translatex * i)), 0.0f, translatez);
          gl.glRotatef(mAngle, 0.0f, 1.0f, 0.0f);
          gl.glScalef(0.4f, scaly * vals[i], 0.6f);
          gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
          gl.glEnableClientState(GL10.GL_COLOR_ARRAY);
          mcube[i].draw(gl);
      }
      mTransY = .075f;
      mAngle = -60.0f;
      translatez = -7.0f;
      Log.i(&quot;Draw&quot;, &quot;called&quot;);
  }
  
  public void onSurfaceChanged(GL10 gl, int width, int height) {
      gl.glViewport(0, 0, width, height);
      float aspectRatio;
      float zNear = .1f;
      float zFar = 1000;
      float fieldOfView = 80.0f / 57.3f;
      float size;
      gl.glEnable(GL10.GL_NORMALIZE);
      aspectRatio = (float) width / (float) height;
      gl.glMatrixMode(GL10.GL_PROJECTION);
      size = zNear * (float) (Math.tan((double) (fieldOfView / 2.0f)));
      gl.glFrustumf(-size, size, -size / aspectRatio, size / aspectRatio,
              zNear, zFar);
      gl.glMatrixMode(GL10.GL_MODELVIEW);
  }
  
  public void onSurfaceCreated(GL10 gl, EGLConfig config) {
      gl.glDisable(GL10.GL_DITHER);
      gl.glHint(GL10.GL_PERSPECTIVE_CORRECTION_HINT, GL10.GL_FASTEST);
      if (mTranslucentBackground) {
          gl.glClearColor(0, 0, 0, 0);
      } else {
          gl.glClearColor(1, 1, 1, 1);
      }
      gl.glEnable(GL10.GL_CULL_FACE);
      gl.glShadeModel(GL10.GL_SMOOTH);
      gl.glEnable(GL10.GL_POINT_SMOOTH);
      gl.glEnable(GL10.GL_DEPTH_TEST);
  }
  
  private boolean mTranslucentBackground;
  private Cube[] mcube = new Cube[4];
  private float mTransY;
  private float mAngle;
  
  }
  </code></pre>
  <p>but unfortunately it is giving the bar graph like this:</p>
  <p><img src="https://i.stack.imgur.com/xxqV9.jpg" alt="enter image description here" /></p>
  <p>anyone will understand this is not exactly like a bar graph
  but please point out my faults here, where am i doing wrong:</p>
  <p>1&gt;the bar heights are 4 1 2 1 but they r not accurately of their sizes</p>
  <p>2&gt;the space between the bars are supposed to be .5f apart but they start with a big gap but reduce repeatedly after every bar</p>
  <p>3&gt;how to start them from one base plane</p>
  <p>EDIT:</p>
  <p>4&gt; can I animate the growth of this bars?how to do that</p>
  <p>My cube code:</p>
  <pre><code>public class Cube {
  private ByteBuffer mTfan1;
  private ByteBuffer mTfan2;
  private int bar;
  
  public Cube(int i) {
      
      this.bar = i;
      
      float vertices[] = { 
              
              -1.0f, 1.0f, 1.0f,
              1.0f, 1.0f, 1.0f,
              1.0f, -1.0f,1.0f,
              -1.0f, -1.0f, 1.0f,
  
              -1.0f, 1.0f, -1.0f,
              1.0f, 1.0f, -1.0f,
              1.0f, -1.0f, -1.0f,
              -1.0f, -1.0f, -1.0f 
      };
  
      byte maxColor = (byte) 255;
      byte colors[][] =
      {   
              {maxColor,maxColor, 0,maxColor},
              {0, maxColor,maxColor,maxColor},
              {0, 0, 0,maxColor},
              {maxColor, 0,maxColor,maxColor},
              {maxColor, 0, 0,maxColor},
              {0, maxColor, 0,maxColor},
              {0, 0,maxColor,maxColor},
              {0, 0, 0,maxColor} 
      };
  
      byte tfan1[] =
      {
              1,0,3,
              1,3,2,
              1,2,6,
              1,6,5,
              1,5,4,
              1,4,0
      };
      byte tfan2[] =
      {
                  7,4,5,
                  7,5,6,
                  7,6,2,
                  7,2,3,
                  7,3,0,
                  7,0,4
      };
          
      byte indices[] =
      { 0, 3, 1, 0, 2, 3 };
  
      ByteBuffer vbb = ByteBuffer.allocateDirect(vertices.length * 4);
      vbb.order(ByteOrder.nativeOrder());
      
      mFVertexBuffer = vbb.asFloatBuffer();
      mFVertexBuffer.put(vertices);
      mFVertexBuffer.position(0);
      
      mColorBuffer = ByteBuffer.allocateDirect(colors.length);
      mColorBuffer.put(colors[bar]);
      mColorBuffer.position(0);
      
      mTfan1 = ByteBuffer.allocateDirect(tfan1.length);
      mTfan1.put(tfan1);
      mTfan1.position(0);
      
      mTfan2 = ByteBuffer.allocateDirect(tfan2.length);
      mTfan2.put(tfan2);
      mTfan2.position(0);
  }
  
  public void draw(GL10 gl)
  {
      gl.glVertexPointer(3, GL11.GL_FLOAT, 0, mFVertexBuffer);
      gl.glColorPointer(4, GL11.GL_UNSIGNED_BYTE, 0, mColorBuffer);
      gl.glDrawElements( gl.GL_TRIANGLE_FAN, 6 * 3, gl.GL_UNSIGNED_BYTE, mTfan1);
      gl.glDrawElements( gl.GL_TRIANGLE_FAN, 6 * 3, gl.GL_UNSIGNED_BYTE, mTfan2);
  }
  
  private FloatBuffer mFVertexBuffer;
  private ByteBuffer mColorBuffer;
  private ByteBuffer mIndexBuffer;
  }
  </code></pre>
  <p>i think something has to be done in the draw method but what??how to animate here?</p>
  <p>please help
  thanks</p>