https://github.com/desgeeko/react-goban

React component displaying a Goban
https://github.com/desgeeko/react-goban

go-game goban javascript reactjs

Last synced: about 2 months ago
JSON representation

React component displaying a Goban

• Host: GitHub
• URL: https://github.com/desgeeko/react-goban
• Owner: desgeeko
• License: mit
• Created: 2015-10-26T22:44:26.000Z (almost 10 years ago)
• Default Branch: master
• Last Pushed: 2016-07-31T20:01:35.000Z (about 9 years ago)
• Last Synced: 2025-08-11T06:55:13.819Z (about 2 months ago)
• Topics: go-game, goban, javascript, reactjs
• Language: JavaScript
• Homepage:
• Size: 249 KB
• Stars: 8
• Watchers: 2
• Forks: 5
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# react-goban

*A stateless React component displaying a Goban.*

Its concern is the View: it implements neither Go rules nor game state.

**Live demo at** [https://desgeeko.github.io/react-goban/](https://desgeeko.github.io/react-goban/)

![SVGoban demo](demo/demo.png)

## Usage

Install the package: `npm install react-goban --save`

Require it and use its `Goban` object:

```jsx

```

### Goban Attributes

* `size` = a number between `9` and `19` (default)

* `theme` = `"classic"` (default) or `"paper"`

* `coordSystem` = `"A1"` (default) or `"aa"`

* `stones` = an object containing coordinates and colors as keys and values

* `markers` = an object containing coordinates and types (for example "circle") as keys and values

* `onIntersectionClick` = callback function from (statefull) parent Component

* `hideBorder` = true or false (default)

* `zoom` = an object describing the region to zoom in, or null (default)

* `noMargin` = true or false (default)

* `nextToPlay` = color of hover effet on placeholders

## Demo

You may `make demo` and browse the bundled app at `demo\index.html`