囲碁きっず詰碁を表示する

今回は、囲碁きっず詰碁問題を表示することにチャレンジしてみました。

Ino Diaryさんがプラグインを発表されておりますことにたどり着き、喜び勇んでインストール。しかしながら、詰碁問題データの参照場所がプラグイン作成時とは変わってしまっているみたいで、詰碁の表示がされませんでした。そこで、現に詰碁が表示されているサイトのソースを参考に、プラグインの詰碁棋譜の参照先を変えてみましたが、盤面は表示されるものの付帯表示が今一で、私ではお手上げでした。

そこで、他にも詰碁問題を掲載しているところ(日々ネット囲碁)があることがわかり、碁盤周りの表示のソースを見たりして、以下のようにファイルを配置し詰碁を表示させてみました。

wgo.jsをダウンロード・展開し、ドキュメントルート以下に配置する。

◇tsumego4kids.js と tsumegoweb.css を tsumego フォルダーに配置する。
 *注:この2つは、ソースから拝借いたしました。

◇tsumego4kids.htmlなるものを作成し、wgo.jsのトップディレクトリに置く。
 *ソースやデモファイルを参考に自サイトの環境に合わせて編集する。

◇ファイルの配置イメージ
 /htdocs/wgo-js-master/docs/
             /extensions/tsumego/tsumego4kids.js, tsumegoweb.css
             /iroiroaruyo/
             /wgo/jquery-3.2.1.min.js
             demo1.html
             tsumego4kids.html

◇投稿の際は、iframeタグでtsumego4kids.htmlを表示させる。

何か、将棋盤を表示させた時とやり方が似ていますね。

それでは、実際に打って問題を解いてみてください。

  ◆クロームとファイアーフォックス以外は、石が置けないみたいですね◆

追記2018.1.12

Ino Diaryさんより、ブログパーツ修正頂き、早速サイドバーに設置いたしました。

2 thoughts on “囲碁きっず詰碁を表示する”

コメントを残す

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