Breaking News
jsChessboard 0.1.0 has been released. Download here.
What is jsChessboard ?
jsChessboard is a JavaScript library designed to programmatically display chessboard diagrams in web pages or web applications.
jsChessboard knows chess notation therefore jsChessboard can interpret a sequence of chess moves in algebraic notation from a given position and draw the new position.
Supported browsers
Most browsers supporting the <canvas> HTML tag are supported by jsChessboard.
- Mozilla Firefox
- Safari
- Google Chrome
- Opera (Opera is not yet supported, see issue #8 for details)
Demo
Getting started
Preparing the HTML
Add the script headers for jsChessboard to work.
<script type="text/javascript" src="chessboard.js"></script>
Then add a <canvas> where you want the chessboard diagram to appear. Note that the canvas element width and height must have the same value.
<canvas id="myboard" width="300" height="300"></canvas>
JavaScript
Add this inline script in your web page
<script type="text/javascript">
function showBoard() {
game = Chessboard.newGame();
game.move("e4, Nf6");
game.draw("myboard");
}
</script> And call this script on page load.
<body onload="showBoard();">
The result should look like that:
