D3.js - 基本的な使い方

D3で用意されている乱数を生成する関数を紹介します。 メソッドはすべて関数を定義するもので のように使用します。 一様分布 d3.randomUniform 一様分布に従う乱数を発生させる関数を定義し ...

D3.js - 基本的な使い方

D3の基本、dataの使い方を紹介します。 とすると"div"要素にデータが割り当てられます。 例えばdiv要素がない状態で とすると、データの個数分のdiv要素が生成されます。 下のように、div要 ...

2018-03-13D3.js - 基本的な使い方

D3のアニメーション用API、transitionと一緒に用いるeaseを紹介します。D3でのアニメーションの設定は下記です。 この設定では、選択した"circle"がcx=500の位置に750ミリ秒 ...

2018-03-12D3.js - 基本的な使い方

D3でWeb上のファイルを読み込むd3-fetchについて紹介します。v5は標準で組み込まれています。v4の場合は下記をHTMLのヘッダーに追加して使います。 APIには次の種類があります。 d3.b ...

2018-03-03D3.js - 基本的な使い方

D3のv5から追加されたカラーテーマです。 v4でもHTMLファイルのヘッダーに下記を追加して呼び出すと使うことができます。 カテゴリー分け用カラーテーマ 9つのカラーテーマが用意されています。配列と ...

2018-03-03D3.js - 基本的な使い方

円グラフやコンター図を書くときに便利なD3のカラースケールの作り方を紹介します。 d3-scale d3.scaleLinear スケールの線形変換を使った方法です。通常はグラフの座標変換に用いますが ...

2018-02-22D3.js - 基本的な使い方

D3.jsの使い方の説明です。テーブルの作り方を紹介します。 配列の場合 表示例: 29行目のrowは、25行目で設定した二次元配列(dataset)のデータが一行ずつ呼び出されます。(例:)。呼び出 ...