ブラウザにお手軽に逆さ駒を表示する方法0.3

なんとか簡易に将棋盤を表示させようという試みがうまくいかないので、ひとまず普通に将棋盤を表示してみます。

9 8 7 6 5 4 3 2 1
後手香.PNG 後手桂.PNG 後手銀.PNG 後手金.PNG 後手玉.PNG 後手金.PNG 後手銀.PNG 後手桂.PNG 後手香.PNG
後手飛.PNG 後手角.PNG
後手歩.PNG 後手歩.PNG 後手歩.PNG 後手歩.PNG 後手歩.PNG 後手歩.PNG 後手歩.PNG 後手歩.PNG 後手歩.PNG
先手歩.PNG 先手歩.PNG 先手歩.PNG 先手歩.PNG 先手歩.PNG 先手歩.PNG 先手歩.PNG 先手歩.PNG 先手歩.PNG
先手角.PNG 先手飛.PNG
先手香.PNG 先手桂.PNG 先手銀.PNG 先手金.PNG 先手玉.PNG 先手金.PNG 先手銀.PNG 先手桂.PNG 先手香.PNG

上の図で使われている駒フォントの画像は、ごく普通の透過つきPNGファイルですが、画像のもとになっているSVGファイルにリンクしています。SVGファイルは今まで通り、SVG対応のブラウザやSVG対応プラグインをインストールしたブラウザで閲覧することができます。

このSVGファイルと、これを他のファイル形式に変換した画像に対する一切の権利上の制限を主張しないことにいたしますので、どなたもご自由にお使いください。特に、画像の改良版の発表を歓迎いたします。実は成駒をまだ作っておりませんので、やってみたい方は是非。また、SVGの素材サイトはそう多くないでしょうから、技術的なお問い合わせやご要望も歓迎いたします。

これらの画像は、当ブログ主がOugishiで下地を作ってInkscapeで整形したものです。ツールの使い方が若干間違っている気もしますが、追加予算ゼロでコンピュータ将棋協会のページに居候している当ブログとしてはこんなものでご勘弁を。

あえてSVGを使う最大のメリットは、拡大・縮小に強いベクターグラフィックが使えることです。図の駒のサイズを変える場合、PNGやJPEGのようなよくあるラスターグラフィックの幅と高さを変えて表示する代わりに、もとのSVGファイルをサイズの異なるラスターグラフィックファイルに変換することで、文字のジャギー(ギザギザ感)を最小限に抑制することができます。ラスターグラフィックへ変換する方法は、たとえば上記のInkscapeが透過PNGへの変換機能を持っています。

と、このシリーズも結局は面倒な話になってしまいましたが、これからもWebで将棋を扱うのにそこそこ使えるネタを引き続きやっていく予定です。それと、駒の字形は今後微調整すると思いますので、知らないうちに変わっていても、そんなもんだと思ってください。

コメント:4個

  1. 太助より、 2007/8/17(金):

    こんにちは。
    今月からですが、将棋観戦WEBなるサイトを作って私もいろいろと試してます。

    で、やはり特定の局面が簡単にWEBに表示できないのではやりにくいので
    棋譜ファイルと指し手Noを指定するとその局面が画像で表示されるような仕掛けを作りました。

    ※ まあ当然うちのサイトにある棋譜しか表示できませんが
    http://dbm.cc/bn/Mc.exe?Parm=sgu!NSColumnT&Init=CALL&SYSKEY=0008

    駒と盤面はテキストで作ったごく貧弱なものなので、ご紹介の駒画像がフリーということであれば(笑)、ぜひ使わせていただきたいと思います。

  2. 山田 剛より、 2007/8/17(金):

    当ブログのSVG画像につきましては、関連の方々の諸権利に配慮していただく範囲において、ご自由にダウンロード・加工・編集してお使いください。
    サイトを拝見いたしました。ベクターグラフィックの駒を使うと、複数のサイズの盤面を用意するのに便利かもしれませんね。
    成駒のグラフィックもできるだけ早めに作りたいと思います。グラフィックのご提供もお待ちしております。

  3. 太助より、 2007/8/18(土):

    お返事どうもです。
    成駒の方はお暇なときでけっこうです。
    (今月は将棋にいろいろ時間を使い過ぎてまして)
    それからCSAの例会にも一度出席してみたいと思います。
    (同時に入会できるんでしたっけ?)

  4. 山田 剛より、 2007/8/19(日):

    CSAに入会される場合は、入会申込の手続きをお願いいたします。
    コンピュータ将棋協会の案内をお読みの上、メールにて記入済の入会申込書をお送りください。

    入会申込手続きは例会の直前の理事会にて承認されますので、その後の例会に参加していただけます。
    よろしくお願いいたします。

コメントをどうぞ

トラックバックのリンク

トラックバック/ピンバック:1個

  1. トラックバック: コンピュータ将棋協会blogより - 2007/8/30(木)