no-image

将棋局面ジェネレータつくりました

局面ジェネレータ

製作期間だいたい12時間。これを6時間くらいで作れるようになりたい。

なんでつくったか

実は類似したサービスはいくつか見つけていました。

が、いろいろな点で自分の要求するものに完全にマッチングしなかったため。

将棋本でよく見かける局面図

こういうのを作りたいわけです。画像だと更にうれしいわけです。ただし、これは画像なのでファイル容量食いますし、拡大縮小すると劣化してしまいます。

将棋局面図の画像作成(SVG,PNG)

フォントに違和感があるのと、文字の大きさがちょっと気に入らない感じ。

画像(PNG形式)とSVG形式のどちらでも保存できるのは便利。

sfenreader

背景は透過できていないし、フォントは変だし、色がついているしでちょっとこれは使いたくない。

常に先手側から見た局面しかだせないので、後手番の戦法を表示しにくいのも難点。

shogizumen.js

これだ!!!!!!!

ただ、許容できないいくつか問題点がありました。

  • BOD形式にしか対応していない。
  • JSで動作するので局面データ(BOD)を記事に書き込む必要がある。
  • 記事にBOD形式形式の局面データを貼り付けると記事を圧迫し、編集しにくい。
  • BOD形式と局面の表示切り替えができるが、そんなの要らない(レガシーブラウザは切り捨てる)
  • SVG形式で表示しているが、image/svgでないので画像として保存できない。

まず気になったのがBOD形式にしか対応していないというところ…

「こんなプロトコルを今更使いたがる人がいるのか?」としか思えなかったのでBOD形式はバッサリ切り捨てます。

人間に見やすくするためだけにわかりにくくするのはノーセンキューです。

それに対してSfen形式はとってもわかりやすい。

たとえば、Sfen形式は以下のようなものです。

lnsgk1snl/6g2/p1pppp1pp/7R1/9/3P5/PPP1PPP1P/1S+b4S1/LN2KG1NL b RB2Pgp 29

一見なんだこれ?ってなりますが、スラッシュ区切りで盤上の駒の位置を表現していると気づけばこちらのほうがコンピュータにとって使いやすい表現方法であることは明らかです。

なのでこっちを使います。

コード

全てサーバーサイドで動作するのでクローンしてきてページ作ればそのまま動きます。

本来はこんな形で公開するものじゃないんですけど、使いかたがよくわからない人のためにという感じですね。

使い方がよく分かる人はBoardクラスを改良してください。よろしく頼んだ。

shogi.phpにBoardクラスが定義されているのでそれを利用します。
インスタンス生成時に先後反転しているかどうかの情報と、loadSfen()でSfen情報を読み込ませてView()すればSVG形式で出力されます。

評価値情報evalと最終手情報lmvはなくても動作します。

使い方

ShogiGUIを開いて「編集」→「局面コピー」→「Sfen」でコピーします。

それを局面ジェネレータの「局面情報入力」というところにそのまま貼り付けます。

Sfenデータには最後の着手が載っていないので、よくある局面図のように最終手を強調したい場合は最終手の位置を数字で入力します。

例えば、「☖3四飛」の場合は「34」と入力します。この数字は必ず半角数字でなければいけません(そのうち全角でもいけるように直すかも)

評価値はソフトでその局面を検討した結果の評価値をメモしておきたい場合に使います。

局面ジェネレータ

めちゃくちゃキレイな画像で表示できて、SVG形式なので無制限の拡大縮小に対応しています。

というわけで、将棋の盤面をきれいに表示したいなーって思っていた人はぜひぜひ使ってみてください。

[amazonjs asin=”B000CNF0DW” locale=”JP” title=”任天堂 将棋 折盤 新桂5号”]

[amazonjs asin=”B000CNF0B4″ locale=”JP” title=”任天堂 将棋駒 プラスチック駒”]

この将棋盤と駒のセットマジで使いやすいのでオススメです。