rui live note

WordPress、PHP、子育て、ブログ、将棋、コワーキング、子育て、群馬等に関する日々感じたことを書いているブログです

*

将棋棋士データベースで遊ぶ(9)〜棋士の師弟関係をD3.jsで可視化その2〜

      2017/04/19   JavaScript, 将棋, 生活, 開発 ,

  • このエントリーをはてなブックマークに追加
  • Pocket

※この記事は「将棋 Advent Calendar 2016 – Adventar」の21日目です。

将棋連盟の棋士データベースで遊んでみようシリーズ、前回の記事では棋士の師弟関係を D3.js で可視化してみましたが、データが多すぎてかなり見づらい状態でしたので多少改善を図ってみました。

棋士の師弟関係をD3.jsで可視化

今回、手を加えた点は次のものです。

  • 未選択時の線の色を薄くした
  • 棋士・女流棋士別に分けた

未選択時の線の色を薄くした

まず、データが多くて師弟関係の関連を表す線がごちゃごちゃ見づらかったので、未選択時の線の色を薄くして選択された線が分かりやすくなるようにしてみました。

前回まではこんな状態でしたが・・・、

kishi_sankey

色を調整したことでこんな感じに。

棋士の師弟関係

棋士を選択した時にも師弟関係の線がだいぶ分かりやすくなりましたね。

棋士の師弟関係

棋士・女流棋士別に分けた

また、データを棋士・女流棋士別に絞ったページをそれぞれ作りました。

こちらが棋士だけのページ。

棋士の師弟関係

こちらが女流棋士だけのページです。

女流棋士の師弟関係

これで前よりもだいぶ見やすくなったと思いますがいかがでしょうか?

まだまだ改善する方法はいくらでもあるんでしょうが、時間の都合もあるのでとりあえず今回はこの辺で・・・。もっと良いアイデアなどありましたら、ぜひご意見お待ちしてます!

この記事で作ったコードはこちらに上げてありますので、どうぞご自由にご覧ください。

ad

この記事が気に入ったらシェアしてもらえると嬉しいです!

  • このエントリーをはてなブックマークに追加
  • Pocket
  • follow us in feedly
  • RSS

  関連記事

jetstream
ほぼ日手帳ボールペンの替芯を交換して使う方法

数年前に買ったほぼ日手帳のボールペンを愛用しています。 肝心の手帳本体の方は三日 …

将棋
将棋ウォーズでようやく三級→二級に昇級したのでこの間を少し振り返ってみる

下手の横好きで最近熱を上げている将棋ウォーズですが、昨日ようやく二級に昇級しまし …

妖怪
妖怪ウォッチ好きの子どもたちもきっと気に入る!妖怪やお化けが沢山出てくるオススメ絵本5選

子ども界を席巻している妖怪ウォッチ。そりゃ面白いですからゲームをしたり、アニメや …

将棋の駒
チープな普及用の将棋盤・駒が欲しい

※この記事は「将棋 Advent Calendar 2016 – A …

羊
お年玉付年賀はがきの当選番号が発表!さて我が家の結果は!?

お正月明けの密かなお楽しみ、2015年お年玉付き年賀はがきの当選番号が本日発表さ …

ようかい体操第一
前橋の商店街で撮影された「妖怪ウォッチ2」CM動画がソフト発売を迎えていよいよ公開!

以前、下の記事で紹介した「妖怪ウォッチ2」CM動画がいよいよ公開されたようです。 …

電王戦
コンピュータ将棋の歴史を紐解くのに「ルポ 電王戦」はおすすめの一冊

話題の新書「ルポ 電王戦―人間 vs. コンピュータの真実」を読みました。 タイ …

将棋ウォーズ
伝説の「ひふみんアイ」を将棋ウォーズで体験してみた

将棋ウォーズは楽しいですね!将棋熱がとても高まっている今日この頃ですが、仕事帰り …

加藤一二三
うひょー!将棋プロ棋士のLINEスタンプが出たので買ってみた

うひょー!こういうのあったらいいなぁと前から密かに思っていた、プロ棋士のLINE …

オムライス
ランチパスポート4店目。しっかりと懐かしい味な高崎市「room’s」のオムライスランチ

お得なワンコインランチが楽しめるランチパスポート、4店目は高崎市内の慈光通りから …