5 Replies Latest reply: Feb 4, 2010 1:13 PM by 843853 RSS

    Drawing isometric tiles...

    843853
      Does anyone have a tehnique to draw a map of isometric tiles??? I read this tutorial, but don´t really get the idea...
      http://www.gamedev.net/reference/articles/article744.asp

      Ty!!!
        • 1. Re: Drawing isometric tiles...
          843853
          so you've decided to create a new thread, rather than take the previously given advice to use Shape?
          • 2. Re: Drawing isometric tiles...
            843853
            not at all... I decided to use the Shape API to get the map cords and all that. This is a different matter. I don´t know how to draw th tiles the propper way. That´s why I posted some other article about a different topic...
            • 3. Re: Drawing isometric tiles...
              843853
              import java.awt.Color;
              import java.awt.Dimension;
              import java.awt.Graphics;
              import java.awt.Polygon;
              
              import javax.swing.JFrame;
              import javax.swing.JPanel;
              
              public class JIsoShape {
                Polygon p;  //Note: Polygon is a Shape
                public JIsoShape(){
                p = new Polygon();
                p.addPoint(51, 0);
                p.addPoint(0, 51);
                p.addPoint(51,101);
                p.addPoint(101, 51);
                JFrame f = new JFrame();
                f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                MyJPanel p = new MyJPanel();
                f.add(p);
                f.pack();
                f.setVisible(true);
                p.repaint();
                }
                public static void main(String[] args) {
                      new JIsoShape();
                }
                class MyJPanel extends JPanel{
                  MyJPanel(){
                    this.setPreferredSize(new Dimension(200,200));
                  }
                  public void paintComponent(Graphics g)  {
                    super.paintComponent(g);
                    g.setColor(Color.RED);
                    g.drawPolygon(p);  // fillPolygon will give a solid color tile
                  }
                }
              }
              • 4. Re: Drawing isometric tiles...
                843853
                That´s not my problem...
                I´ve got an 52*32 isometric tile and a int[][] array that stores which tile should be drawn (0 for frass, 1 for water, etc...)
                I need to draw these tiles on screen according to the map array so that I get the tiles perfectly arranged on screen.

                If I go
                for(int x = -2; x < 100; x++) {
                              for(int y = -2; y < 100; y++){
                     g.drawImage(imgload.getImage("tile"), x*52+52/2 , y*32+52/4,null);
                
                     }
                     }
                I get some tile shaped spaces among each tile.

                If I go
                for(int x = -2; x < 100; x++) {
                              for(int y = -2; y < 100; y++){
                
                          
                     g.drawImage(imgload.getImage("tile"), x*52/2 , x*52/4,null);
                
                     }
                     }
                I get overlaping tiles...

                Edited by: CPFrn on Feb 4, 2010 10:26 AM
                • 5. Re: Drawing isometric tiles...
                  843853
                  You need to associate the image with your tile, so you are going something like this:
                  for(int xIndex = 0; xIndex<N; xIndex++){
                    for(int yIndex=0; yIndex<K; yIndex++{
                      myTile[xIndex][yIndex].draw(g);
                    }
                  }
                  Where myTile knows how to draw itself and has an image associated with it.

                  If you have 52x32 pixel tiles:
                  myTile = new myTile();
                  myTile.addPoint(xIndex*52+26, yIndex*32);
                  myTile.addPoint(xIndex*52, yIndex*32+16);
                  mytile.addPoint(xIndex*52+26, yIndex*32+31);
                  myTile.addPoint(xIndex*52+51, yIndex*32+16);
                  myTile.type = //what ever you want here;
                  Tile[xIndex][yIndex] = myTile;
                  define Tile dimension:
                  MyPolygonTile[][] Tile = new MyPolygonTile[N][K];
                  and yes, you'll have to implement draw to put your image on the graphic object. (embrace the object part of OOP)