「 月別アーカイブ：2016年02月 」 一覧
散布図のデータに応じて目盛りを調整する
散布図に目盛りを表示してみます。 サンプルコードの実行結果はこちら [crayon-5ce4a225aa568299234364/] サンプルコードについ
ボタンをクリックして、折れ線グラフの表示範囲を変える
JSONファイルからデータを読み込んで折れ線グラフを表示します。グラフのデータの読み込みは10年分のみにします。 サンプルコードの実行結果はこちら [crayon-5ce
データセットと日付を対応させてみる
前回の記事で、JSON形式のデータを扱ったデータには、折れ線グラフの数値だけではなく、年度のデータも含まれています。今回は横軸である下の目盛りにデータのの年数を表示します。 { year
JSONみたいなデータを読み込んでグラフにする
まずは、サンプルコードの実行結果はこちら [crayon-5ce4a225ade52112891624/] 今回紹介するのも複数の線グラフを表示するものですが、
２次元配列のデータを読み込んで、折れ線グラフを表示する
２次元配列のデータを用意して、少し複雑なデータを読み込んで折れ線グラフを表示してみます。 サンプルコードの実行結果はこちら [crayon-5ce4a225ae74545
折れ線グラフを塗りつぶす
D3.jsでは両機内にを塗りつぶしたグラフを表示することができます。このとき、d3.svg.line()メソッドではなくて、d3.svg.area()メソッドを使います。 座標値を指定するx()､y
複数の折れ線グラフを表示する
複数の折れ線グラフを表示します。今回は３つのデータを用意して、３つの折れ線グラフを表示します。目盛りを表示する部分と折れ線グラフを描画する部分を関数にします。 サンプルコードの実行結果はこちら
折れ線グラフの縦方向の動きを分かりやすくする
縦方向の表示を２倍に、目盛り(縦、横軸)を表示する グラフの変化を大きく見せるために縦方向の表示を２倍にします。 サンプルコードの実行結果はこちら [crayon-5
