Home * Programming * Graphics Programming * 2D Graphics Board

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

Mac Hack

machackdisplay02.jpg
Mac Hack, DEC 340 display, 1968 [1] [2]

GNU Chess

517px-Xboard_4.2.7_on_KDE_4.2.2_and_Fedora_10.png
GNU Chess on XBoard [3]

MChess

mchess35.gif
M-Chess Pro 3.5 (1993) [4]

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 [5] , 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 [6] :
/* 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 [7] 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 [8] [9] [10]:
Chess_symbols.PNG

See also


Publications


Forum Posts


External Links


Coordinates


Geometric primitives


Toolkits, Libraries and APIs


References

  1. ^ I resign by Lawrence J. Krakauer
  2. ^ Chess stories by Lawrence J. Krakauer
  3. ^ XBoard from Wikipedia
  4. ^ Studie: Schachspielen mit ein 286er 12 MHz Laptop - Schachcomputer.info Community by Spacious Mind, May 22, 2010 (German)
  5. ^ CDC Class - Device Context, Microsoft Foundation Class Library, MSDN
  6. ^ Code by Gerd Isenberg, written in about 2000
  7. ^ File:Chess bdl40.png - Wikimedia Commons
  8. ^ Unicode values for chessmen by Steven Edwards, CCC, March 07, 2011
  9. ^ Miscellaneous Symbols – Test for Unicode support in Web browsers
  10. ^ Unicode representations of Chess symbols in two fonts (Arial Unicode MS and Tahoma) by Monedula, Wikimedia Commons
  11. ^ Alpha compositing from Wikipedia
  12. ^ MinGW from Wikipedia

What links here?


Up one Level