andyruwruw / chess-image-generator

Accepts FEN, PGN or array data for chess board and generates PNG or buffer.

hello! here's a little about me:

i really like music 🎧

inspired by natemoo-re

i was a frontend intern at chess.com ♟️

luckily being good at chess wasn't a pre-req to the job

i'm a vue.js fanboy, but i do some other stuff too 🔨

chess-image-generator's Issues

installation fails

npm i -S chess-image-generator

fails with numerous errors (see log below) on my Debian Linux system. Can someone fluent with linux command line Javascript point me in the right direction? Thanks.

https://drive.google.com/file/d/11Fad6mYA3hfT9Bvr9PVHvfZXjuaftpYP/view?usp=sharing

SVG Manipulation

Hey everybody and hey @andyruwruw !

Thanks for creating this beautiful library, got it integrated in whatsapp-chess. I would love to add col and row descriptions (ABCDEFGH and 12345678).

We could either achieve this by coding it right into, or by letting the user get the svg itself so he could then manipulate it.

Would love to do this and will open a pr right away!

Hope you will merge it if it suits your roadmap and release it asap.

Pieces are blurred.

Hi, this is a very useful lib, thank you. I was planning to use it for my project, but unfortunately pieces are blurred, as the ones used as a demonstration in the README.

Looking at the source, it seems logical since images are loaded, and then scaled. I think it would be better to generate a vector image instead, and then scale it, and convert it to PNG, to preserve image quality.

I could not find a way to do this with Canvas (using Canvas in a non-web NodeJS env is a little hackish), so I cannot PR something, and ended up making my own script. I thought it would interest you so I made a gift with a simplified version (using Merida style) that generates a SVG file, that next could be easily converted to a high quality PNG file :

https://gist.github.com/loicmarie/6426394790fb0155225fa4994f89cbdf

Wrong lib

Hey,
In the readme file, you need to chnage this:
var ChessImageGenerator = require('chess-web-api');

To
var ChessImageGenerator = require('chess-image-generator');

Thanks :)

Frame Errors

chess-image-generator version: 1.0.9

Steps to reproduce

import ChessImageGenerator from "chess-image-generator";

const FEN = "r2qk2r/p1p5/bpnbp2p/1N1p1p2/P2P1p1N/2PQ2P1/1P2PPBP/R4RK1 b kq - 1 13";

const SIZE = "1024";
const LIGHT_COLOR = "#efefef";
const DARK_COLOR = "#8777b7";

(async () => {
  let imageGenerator = new ChessImageGenerator({
    size: SIZE,
    light: LIGHT_COLOR,
    dark: DARK_COLOR,
    style: "merida"
  });

  await imageGenerator.loadFEN(FEN);

  await imageGenerator.generatePNG("example.png");
})();

Expected behavior

This should output an image.

Actual behavior

It fails with this error:

/Users/landon/Development/personal/chess-flashcards/node_modules/chess-image-generator/src/chess-image-generator.js:172
      fs.write(fd, buffer, 0, buffer.length, null, (writeError) => {
                                     ^

TypeError: Cannot read property 'length' of undefined
    at /Users/landon/Development/personal/chess-flashcards/node_modules/chess-image-generator/src/chess-image-generator.js:172:38
    at FSReqCallback.oncomplete (fs.js:163:23)

It looks like the generateBuffer function always returns undefind because frame.toBuffer() returns undefined.

Add option for board orientation

chess-image-generator version:

latest

You should add an option to specify if the board should be seen from white or black's perspective.

Suggestions. I guess

DELETE THIS PLEASE.

Refactor for Blurriness

There have been some issues with blurring scaling the chess pieces to the PNG size.

Goal should be to offer a SVG option and clean up the PNG as best as possible.

support chinese chess or not?

Dear Andy,

Does your program support chinese chess?

Best regards,
sandy

Any way to include the columns and rows?

just nice to have a reference sometimes

Weird piece visual artefacts when using generatePNG

Issue

As the title suggests, after using the generatePNG function, the image outputted presents weird artefacts near the pieces.

Generated Image

Code used to generate the file

const ChessImageGenerator = new require('chess-image-generator');
const imageGenerator = new ChessImageGenerator({
  size:640
});
imageGenerator.loadFEN('r2qk2r/p1p5/bpnbp2p/1N1p1p2/P2P1p1N/2PQ2P1/1P2PPBP/R4RK1 b kq - 1 13')
    .then((data)=>{
         console.log("SUCCESS");
    }, logError);
imageGenerator.generatePNG('./testgame2.png');

TypeError: generator.highlightSquares is not a function

chess-image-generator version:

latest

Steps to reproduce

await generator.highlightSquares(["c8", "b7"])

Expected behavior

It should highlight that squares

Actual behavior

Showing error:
TypeError: generator.highlightSquares is not a function

use Canvas#toBuffer() instead

Drop this lib

chess-image-generator/src/chess-image-generator.js

Line 5 in e885ef1

const Frame = require('canvas-to-buffer');

it will work much faster