2D Graphics Board

From Chessprogramming wiki
Jump to: navigation, search

Home * Programming * Graphics Programming * 2D Graphics Board

Mac Hack display [1] [2] [3]

2D Graphics Board,
a 2D graphics image of a chessboard and the pieces of a chess position on a computer display, either fullscreen or board window of a chess GUI, or printer, similar to a chess diagram in print media. A 2D board window should be isotropic and quadratic, with all squares of same size.

Screenshots

GNU Chess

Xboard 4.2.7 on KDE 4.2.2 and Fedora 10.png

GNU Chess on XBoard [4]

MChess

Mchess35.gif

M-Chess Pro 3.5 (1993) [5]

IsiChess

IsiChess.jpg

IsiChess 2D board with vector graphics

Drawing Pieces

2D Vector Graphics

IsiKnight.JPG
The C++ code is based on the Windows Microsoft Foundation Class Library, a class extension of the Device Context of the Graphics Device Interface [6] , in conjunction with "handmade" polygons with coordinates in a x- and y-range of ±16 (positive values right and down), is used in IsiChess to apply vector graphics to draw the pieces in the board window or as figurine notation. For each piece an array of connected lines is declared, the first one a closed polygon, which is filled by the piece color [7] :
/* Piece Coordinates */
static POINT KnightPoint0[] = {
   { 10, 12},{ 11,  2},{ 10, -3},{  8, -6},
   {  6, -8},{  4, -9},{  1,-11},{  0,-12},
   { -1,-11},{ -2,-11},{ -3,-12},{ -3,-10},
   { -5, -8},{ -6, -6},{ -8,  0},{-10,  2},
   {-10,  4},{ -8,  6},{ -6,  5},{ -5,  4},
   { -4,  2},{ -2,  1},{ -1,  0},{  0, -2},
   { -1,  0},{ -1,  2},{ -2,  4},{ -6,  8},
   { -8, 12},{ 10, 12}
};

static POINT KnightPoint1[] = { { -3, -7},{ -4, -6} };
static POINT KnightPoint2[] = { { -8,  2},{ -9,  3} };

static POINT BishopPoint0[] = {
...

struct PIECEPOLY {
   unsigned int nPoints;
   const POINT *Points;
};

static PIECEPOLY KnightPoly[] = {
   {sizeof (KnightPoint0) / sizeof (KnightPoint0[0]), KnightPoint0},
   {sizeof (KnightPoint1) / sizeof (KnightPoint1[0]), KnightPoint1},
   {sizeof (KnightPoint2) / sizeof (KnightPoint2[0]), KnightPoint2}
};
...

struct PIECEIMAGE {
   int nPolys;
   PIECEPOLY *Poly;
};

static PIECEIMAGE PieceImage[] = {
   {0,  NULL},
   {sizeof (PawnPoly)   / sizeof (PawnPoly  [0]),  PawnPoly},
   {sizeof (BishopPoly) / sizeof (BishopPoly[0]),  BishopPoly},
   {sizeof (KnightPoly) / sizeof (KnightPoly[0]),  KnightPoly},
   {sizeof (RookPoly)   / sizeof (RookPoly  [0]),  RookPoly},
   {sizeof (KingPoly)   / sizeof (KingPoly  [0]),  KingPoly},
   {sizeof (QueenPoly)  / sizeof (QueenPoly [0]),  QueenPoly},
   {0,  NULL},
};

/* Drawing implemented as extension of Windows MFC Device Context Class CDC */
void CIsiDC::drawPiece(const CRect &r, int piece) {
   drawPiece(r, piece, m_sPieceColor[piece&1], m_sPieceBorderColor[piece&1]);
}

void CIsiDC::drawPiece(const CRect &r, int piece, COLORREF piececolor, COLORREF pencolor) {
   CPen pen(PS_SOLID, 1, pencolor);
   CBrush brush(piececolor);
   CPen* pOldPen = SelectObject(&pen);
   CBrush* pOldBrush = SelectObject(&brush);

   PIECEIMAGE *pim = PieceImage + (piece >> 1);
   int i; PIECEPOLY  *p;
   for (i=0, p = pim->Poly; i < pim->nPolys; ++i, ++p) {
      POINT points[64];
      transformPoints (points, p->Points, p->nPoints, r);
      if (i == 0) { /* closed polygon */
         BeginPath();
         Polyline(points, p->nPoints);
         EndPath();
         FillPath();
      }
      Polyline(points, p->nPoints);
   }
   SelectObject(pOldBrush);
   SelectObject(pOldPen);
}

void CIsiDC::transformPoints (POINT* target, const POINT* source, int nPoints, const CRect &r) {
   int width = r.Width();
   int height = r.Height();
   CPoint center = r.CenterPoint();
   while (nPoints--)
      *target++ = transfrom (*source++, width, height, 32, center);
}

POINT CIsiDC::transfrom (const POINT &c, int scalx, int scaly, int qxy, const POINT &trans) {
   return CPoint((c.x*scalx)/qxy, (c.y*scaly)/qxy) + trans;
}

Bitmaps

A more common way is to display pieces in form of bitmaps or pixmaps, small images of pieces, painted with an external program such as GIMP, Paint etc., stored as Raster graphics in an external file or resource format, such as Portable Network Graphics [8] or Windows BMP file format, which may be used in conjunction with Bit blit for scaling.

Unicode

An alternative technique for piece drawing is the use of Chess symbols in Unicode as scalable TrueTypefonts [9] [10] [11]:

Chess symbols.PNG

See also

Publications

Forum Posts

External Links

Coordinates

Cartesian coordinate system
Curvilinear coordinates
Reflection (mathematics)
Rotation (mathematics)
Rotation matrix
Transformation matrix
Translation (geometry)

Geometric primitives

Toolkits, Libraries and APIs

Direct2D from Wikipedia
Direct3D from Wikipedia
DirectDraw from Wikipedia
DirectDraw Surface from Wikipedia
CDC Class - Device Context, Microsoft Foundation Class Library, MSDN
gtkmm from Wikipedia
Gtk Sharp from Wikipedia
lib-gwt-svg « vectomatic
vectomatic - standard dynamic 2D graphics in web browsers - Google Project Hosting
Graphics Programming - Introduction to OpenGL (pdf)
Comparison of OpenGL and Direct3D from Wikipedia
X11.app (XQuartz) from Wikipedia » OS X

References

Up one Level