*

JSONデータを読み込んで、ボタンでパックレイアウトで表示するデータを切り替える

公開日: : 最終更新日:2016/03/10 D3.js ,

今回は、JSONデータを読み込んでパックレイアウトをまず表示します。そのうえでHTMLファイル上に3つのボタンを設けて、ボタンを押すと読み込むデータを切り替えてパックレイアウトを表示するコードを書いてみます。

サンプルコードの実行結果はこちら

スポンサードリンク

関連記事

D3.js

D3.jsとrect要素を使い四角形を表示する

タイトルの通りD3.jsを使い棒グラフを用意します。 サンプルコードの実行結果はこちら

記事を読む

D3.js

日本の地図データ(国土数値情報)を使い、地図を表示する

世界地図を表示したので、今回は日本国内の地図を表示します。サンプルコードにコメントを付しましたので、

記事を読む

D3.js

折れ線グラフの縦方向の動きを分かりやすくする

縦方向の表示を2倍に、目盛り(縦、横軸)を表示する グラフの変化を大きく見せるために縦方向の表示を

記事を読む

D3.js

散布図のデータに応じて目盛りを調整する

散布図に目盛りを表示してみます。 サンプルコードの実行結果はこちら [

記事を読む

D3.js

外部ファイルを読み込んで円グラフを表示させる

CSVデータを読み込んでグラフを表示させてみます。 サンプルコードの実行結果はこちら

記事を読む

D3.js

複数の図形を操作する

D3.jsでは複数の図形を操作するにはselectAll()メソッドを使います。 selectAl

記事を読む

D3.js

グループと図形移動

複数のSVG用をまとめて扱う場合に必要なものはグループ化です。 SVGではg要素を使って要素を囲み

記事を読む

D3.js

折れ線グラフを塗りつぶす

D3.jsでは両機内にを塗りつぶしたグラフを表示することができます。このとき、d3.svg.line

記事を読む

D3.js

マウスイベントでグラフを変化させる

D3.jsでは要素にイベントを設定することができます。この記事ではマウスカーソルが棒に重なったとき・

記事を読む

D3.js

円グラフの色分けしてみる

円グラフは、それぞれの扇の部分が色分けされているのが普通です。扇形部分を色分けするにはstyle()

記事を読む

スポンサードリンク

Message

メールアドレスが公開されることはありません。

CAPTCHA


次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">



スポンサードリンク

jQueryMobile
トグルスイッチを設定する

トグルスイッチ(toggle switch)とは、〇型のつまみを左右に

jQueryMobile
項目選択の複数ウィジェットをグループ化する

年月日など、複数のリストから同時に選択したいとき、ウィジェットのグルー

jQueryMobile
<select>により項目選択

ボタンによる選択では、1つの項目だけ選択するか、複数を同時に選択するか

jQueryMobile
値を選択するボタンを表示する

値を選択するボタンは以下の2つがあります。 ・複数の値から1つだ

jQueryMobile
ボタンを設定する

前回の記事では<a data-role="button">

→もっと見る

  • スポンサーリンク

PAGE TOP ↑