*

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

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

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

まずは上記のプラグインをダウンロードします。今回は、jsフォルダ内にfisheye.jsというファイル名で用意し、HTMLファイル内でD3.jsファイルを読み込んだ後に、このプラグインも読み込みます。これで準備OKです。
サンプルコードの実行結果はこちら

スポンサードリンク

関連記事

D3.js

散布図にグリッドを表示してみる

目盛りの表示は何度もしました。散布図でも縦軸、横軸を表示しました。 今回は、グリッド(マス目)を表

記事を読む

D3.js

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

今回は、JSONデータを読み込んでパックレイアウトをまず表示します。そのうえでHTMLファイル上に3

記事を読む

D3.js

縦棒グラフにアニメーションを付ける

グラフを効果的に見せるためにアニメーションを使います。縦棒グラフをアニメーションさせます。D3.js

記事を読む

D3.js

D3.jsって何?

D3.jsとは、データを視覚的に表現するためのJavaScriptライブラリです。 D3.jsが表

記事を読む

D3.js

多機能アニメーション付棒グラフを作ってみる

たいそうな記事のタイトルですが、過去7記事で書いたことを まとめた棒グラフを作成します。 サ

記事を読む

D3.js

d3.jsでJSONファイルを読み込む

JSON形式は複雑なXML形式と比べてシンプルで、データ容量も少なくて すむので、ウェブでよく利用

記事を読む

D3.js

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

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

記事を読む

D3.js

ヒートマップをDOMに表示する

D3.jsは表示処理は行わないため、SVG、canvasだけではなく、HTMLのdiv要素を使いグラ

記事を読む

D3.js

図形のスタイルを指定する

D3.jsで図形の属性はattr()メソッドでしました。 図形のスタイルはどう指定すればいいのか。

記事を読む

D3.js

円グラフを作る

日頃のグラフの中でよく見かけるのが円グラフです。スマートフォンの販売シェアとかを表す時に使われます。

記事を読む

スポンサードリンク

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 ↑