*

「 D3.js 」 一覧

D3.js サーバーのログを読み込んで、OSのシェアを表示してみる

D3.jsを利用して、サーバーログを読出して、情報を得ることができます。 サンプルコードの実行結果はこちら [crayon-5d30984cd903955319919

続きを見る

フィッシュアイプラグインを使ってみる

今回は、マウスカーソルを重ねたときに、マウスカーソルを中心にして拡大するフィッシュアイプラグインを利用します。 フィッシュアイプラグインはこちら まずは上記のプラグインをダウンロードします。今

続きを見る

グラフをソートして表示する

以前、縦棒グラフを表示するサンプルコードを書きましたが、時と場合によりただ棒グラフを表示するだけではなく、インタラクティブに表現したいことがあります。たとえば、棒グラフで商品別の売り上げを表示する時、

続きを見る

鶏頭図(けいとうず)を表示する

2016/03/23 | D3.js

D3.jsでは円グラフに一工夫を加えることで鶏頭図を表示できます。鶏頭図は円グラフと似ていますが。それぞれの扇形の中心角は一定で、量は中心からの半径で表示されます。 サンプルコードの実行結果はこ

続きを見る

ツリーレイアウトを表示する

D3.jsにはツリーレイアウト(樹形図・木構造といったりもします)を生成することができます。ツリーレイアウトは以前の記事で書いたツリーマップと似ています。データセットに必要なプロパティ(キー名)も同一

続きを見る

積み上げ棒グラフ

D3.jsでは積み上げ棒グラフもあります。積み上げ棒グラフはグループ化のg要素を使い、その中に、rect要素を生成します。コメントはサンプルコードの中に書きました。 サンプルコードの実行結果はこ

続きを見る

フォースレイアウト

D3.jsでは、フォースレイアウトを作成する機能も用意されています。フォースレイアウトは予めノードとノードを結びつけるリンク情報が必要です。今回用意したサンプルコードではデータセットのnodesにノー

続きを見る

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

世界地図を表示したので、今回は日本国内の地図を表示します。サンプルコードにコメントを付しましたので、そちらをご覧ください。 地図データは国土数値情報ダウンロードサービス 手順: 1.上記

続きを見る

地球を表示する

2016/03/18 | D3.js ,

D3.jsでは投影方法を指定できるので、前回使用した世界地図のデータを利用して球体にマッピングして、地球儀を表示します。 サンプルコードの実行結果はこちら [crayon

続きを見る

世界地図を表示する

地図のデータ形式にはいろいろなものがありますが、多くの地図データはshape形式(.shp)です。この形式はD3.jsでは扱うことができません。ほかに、JavaScriptで手軽に扱えるようにしたのが

続きを見る

スポンサードリンク



スポンサードリンク

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

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

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

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

jQueryMobile
<select>により項目選択

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

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

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

jQueryMobile
ボタンを設定する

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

→もっと見る

  • スポンサーリンク

PAGE TOP ↑