将棋|ブラウザ上でJavaScriptを使って棋譜データを再生する方法【jsShogiKifu】

公開日: : 最終更新日:2018/05/05 プログラミング , , , , ,

将棋の棋譜データをブラウザ上で再生する方法を調べて分かったことを紹介します。

スマホ上では Flash Player が使えないため、スマホにも対応するため JavaScript を使ったものを探していて、再生できるものが見つかりました。

「jsShogiKifu」というものです。

こちらの GitHub にアクセスし、「clone or download」からZIPファイルで一式ダウンロードします。

https://github.com/knu/jsShogiKifu

解凍すると複数のフォルダ、ファイルが展開されますが、「test」フォルダにサンプルが入っているので、好みに合わせたものを選びます。テンプレートで指し手に対するコメントウィンドウの有り無しなどを選べるようになっています。

テンプレートは5つあり、それぞれ、

  • jquery_shogi_board.html  ← 棋譜データ・コメント有り(コメント位置:サイド)
  • jquery_shogi_board_mate_problem.html  ← 棋譜データ・コメント有り(コメント位置:下部)
  • jquery_shogi_board_min.html  ← 棋譜データ・コメント無し(盤面のみ)
  • jquery_shogi_board_no_comment.html  ← 棋譜データ有り・コメント無し
  • jquery_shogi_board2.html  ← jquery_shogi_board_mate_problem.html とほぼ同じ?

となっています。

今回は、コメントウィンドウは必要なかったので、jquery_shogi_board_no_comment.html を指定しました。

sample.html などを参考にして、以下のような html ファイルを用意しました。

「./081217-h.kif」のところで、棋譜ファイルを指定しています。

棋譜のファイル形式は、以下の3つに対応しているようです。

KIF形式:プロ棋戦、将棋倶楽部24等で広く用いられている形式。各指手ごとの消費時間の指定もできる。
KI2形式:指手の表記方法が日本将棋連盟準拠である。各指手ごとの消費時間は指定できない。
CSA形式:コンピュータ将棋の棋譜で用いられている形式。各指手ごとの消費時間の指定もできる。

今回は、KIF形式のサンプルを用いました。

無事、ブラウザ上で棋譜を再生することができました。

関連記事

【ETL】手書き文字のデータベースをダウンロードしてみた

文字認識や筆者識別の研究を行う際、手書き文字のデータが必要になってきます。 そのあたりの研究を

記事を読む

Windows で Scala をインストールする。

Windows に Scala というプログラミング言語をインストールしたときのメモです。Java,

記事を読む

Apache の error_log で「(8)Exec format error: exec of 」エラー表示が出たときの対処法

Perl でウェブサイトを作っていて、Apache のエラーで少しはまったため、そのときのメモ。

記事を読む

囲碁|ブラウザ上でJavaScriptを使って棋譜データを再生する方法【WGO.js】

以前、将棋の棋譜をブラウザ上で再生する方法 を紹介しました。同様に、囲碁の棋譜再生も JavaScr

記事を読む

【情報処理学会】正会員から学生会員に変更する方法。

大学院に行くことになったので、入会していた情報処理学会を、 正会員から学生会員に変更

記事を読む

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

【機械学習】 scikit-learn で不正解データを抽出する方法【Python】

Python の scikit-learn ライブラリを使って機械学習

【Python】 複数の辞書型の同じ key を持つ value を計算に用いる方法。

Python で、複数の辞書型を読み込んで、同じキー(key)を持つ数

【Python】 Series 型を dict(辞書型)に変換する方法。

Python で Series 型を dict(辞書型)に簡単に変換す

【Python】 DataFrame の特定の列で出現回数をカウントして降順でソートする方法。

Python で DataFrame 型の特定の列を指定して、対象列の

【テキストマイニング】 Amebaブログからデータ取得するための準備。

テキストマイニングを行うために、Ameba ブログ(アメブロ)のデータ

→もっと見る

PAGE TOP ↑