You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
fp.js is a tiny library to help keep d3.js dom manipulation code clean. Update (December 29, 2013) # Upgraded to support the format at the bottom. Check out this rewrite of the d3.js Grouped Bar Chart Example using fp.js. I write a lot of d3.js code and most dom manipulation code got complicated and hard to maintain. With fp.js attributes, styles and events can be set easily. But the most importan
この記事はD3.js Advent Calendar 2013の9日目です。Open Dataと大きなことを言いましたが、今回は行政データの基本のキであるところの地図を描画してみます。なわけで地図を描画するところがゴールです。 今回の完成図は下記です。国土交通省から神奈川県の行政区域データを取得しD3.jsで描画します。ついでにホームタウンとしているJリーグチーム毎に色塗りしてみました。(マリノスの最終節については触れるべからず!) サンプルページはこちら D3 Geo Projection D3.jsには地理描画機能がデフォルトで含まれており、さまざまな投影法によって地形データを描画することができます。 https://github.com/mbostock/d3/wiki/Geo-Projections この機能を使って地図を描画します データの入手 まずは国土交通省のページから行政区
この投稿はD3.js Advent Calendar 2013の15日目です。前回担当分はQiitaに書きましたが、今回は実装の紹介というようりも事例紹介なのでブログの方に書きます。というか、自分のブログのことをすっかり忘れていたのですが、同僚に知らぬまにウォッチされていたようなので、たまに書いてみようと思います 今回はD3.jsを実際につかってOpen Dataをビジュアライズしているサイトをいくつか紹介します 1. Not All Neighborhoods Are Created Equal (Boston Edition) ボストンの地価の分布をビジュアライズしたものです。Max、Minと中央値を表現するグラフにマウスを重ねると該当の地域がハイライトされます 2. Drought Extends, Crops Wither – The New York Times 干ばつによる作物
UPDATE: Radian is now open source. Read about it on the BayesHive website here. Courtesy of Hideharu Sakai, this article is also available in Japanese. One of the things we needed to be able to do for the BayesHive software I’m working on with Tom Nielsen of OpenBrain is easily produce plots within our front-end web app. There are lots of JavaScript libraries for doing this: Tom started off using
Force-Directed Graph 力指向グラフは、nodeの間と描画領域に物理的な作用を計算してうまいぐあいに表示するらしいです。 各node(円)はマウスで動かせます。 元データはPixivのタグ検索集計です。「(ラブライブ! OR ラブライブ!) にこまき」などそれぞれのキーワードで検索して出てきた作品数を集計しました。 線の太さがタグ数(「にこまき」なら“にこ”“まき”間の線が出現数に応じて太くなる)を表しています。nodeの外周を囲む線は学年ごとの塗り分けをしています。 JSONのデータの構造 nodes配列をdata()でセットして、今までと同じようにcircleとlineをappendします。 links配列は、各nodeの関係を記述します。sourceの0は、nodes[0]です。 graph = { nodes : [ { "name" : "にこ", "color
d3js.org 日本語化プロジェクトについて [目次へ] JavaScriptデータ視覚化ライブラリ D3.js の本家サイト http://d3js.orgの 日本語化を行うプロジェクトです。 翻訳は Michael Bostock 氏の許諾を得ておもにドキュメントの 日本語化を行います。 更新履歴 [目次へ] [2013/01/02] 地図を作ろうの翻訳 [2012/12/22] バージョン 3.0 の新機能の翻訳 [2012/12/09] TopoJSON ホーム、および 仕様書ページ翻訳 [2012/12/05 24:46] ドキュメント、および 解説その他のページ作成(翻訳はまだ) [2012/12/04 21:09] 三つの小円作成・翻訳 [2012/12/03 13:02] d3js.org 日本語化プロジェクトを更新 (サイト構成の追加、他) [2012/12/02
Currently no descriptions for this product and will be added soon.
This project is an attempt to build re-usable charts and chart components for d3.js without taking away the power that d3.js gives you. This is a very young collection of components, with the goal of keeping these components very customizable, staying away from your standard cookie cutter solutions. View more examples » GitHub Repo Download d3.v3.js. This is the only required library for NVD3. Dow
What is this? Tributary is an experimental environment for rapidly prototyping visualization code. The environment provides several libraries useful for this kind of coding, as well as a simple interface for live code editing. Some of these images take you to galleries of Tributary examples, don't be afraid to click on images which take you to the actual live tributaries! Who is involved? Tributar
By Luke Francl (look@recursion.org), August 2011 d3.js is a data visualization library by Mike Bostock, who is also the primary creator of Protovis, which D3 is designed to replace. D3 has a steep learning curve, especially if (like me) you are not used to the pixel-precision of graphics programming. To build a visualization with D3, you need to understand JavaScript objects, functions, and the me
2012年2月18日に開催された「HTML5+WordBench勉強会 in 神戸」で、データビジュアライゼーションのためのJavaScriptライブラリ「d3.js」について発表してきました。 主催は「Web CAT Studio(株式会社リクルートエージェント)」さん、「WordBench神戸」さん、そして僕が所属している「HTML5-West.jp」の3団体です。 WordPress+HTML5勉強会 in 神戸 : ATND プレゼン資料 実際にプレゼンで使ったスライドはこちら。 終盤のライブコーディングで作った「棒グラフ」のコードはこちら。 kadoppe/HTML5-WordPress-in-Kobe-d3js-sample – GitHub サマリー わかりづらいデータを可視化することで、人間のデータ理解を助けることができる「データビジュアライゼーション」。このデータビジュア
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く