サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
画力アップ
visualizing.jp
The PuddingというメディアのJan Diehmさんがデータジャーナリズムの講義(Data Journalism and Visualization with Free Tools)にて、どのようなタイプのデータ・ストーリーが存在するかとして、大きく以下の四つに分類し紹介していました。初見の分類法でしたのでこちらでも紹介します。説明文には筆者(矢崎)独自の観点や補足も付けています。ピックアップされている事例は元の講義に準じます。 Scrollytelling(スクローリーテリング)Microstories (マイクロストーリーズ)Non-traditional (非伝統的)Explainers (説明者) Scrollytelling(スクローリーテリング) 閲覧者がページを下にスクロールすると、アニメーションとともにストーリーが直線的に展開する手法。閲覧者はただスクロールするだけ
どんな図? ベン図ときくと、たとえばSQLデータベースにおいて、二つのテーブルを結合する際の、結合の仕方について説明した図を思い浮かべる方も多いと思います。 Four different types of JOINs 作者のジョン・ベンにちなんだ名称で、閉曲線(閉じた曲線で作られた閉じた図形)を使って集合理論的な関係を示す図として知られています。 この図に登場するデータセット(テーブル)は二つですが、登場するセットが最大3つまでであれば、これはベン図といえます。それ以上のデータセットにおいては、ベン図といえないかもしれません。 同様のチャートで、レオンハルト・オイラーにちなんだオイラー図というものがあり、オイラー図とベン図の関係を図で示すとこのようになります。 つまり、より一般的なものがオイラー図であり、そのうちある要件を満たすものをベン図と呼びます。その要件とは「集合のすべての交差を示さ
Visual Vocabulary Finantial Times インタラクティブ版Tableau Public版Power BI版Vega版
人類学者のBrent BerlinとPaul Kayさんの研究成果 (Basic Color Terms: Their Universality and Evolution. 1969) として、 「多様な文化を持つ世界の100以上の言語において、色の名称の発明順序がほぼ一緒」 であったとしています。 1, 2番め:白と黒3番め:赤4, 5番め:緑と黄、もしくは、黄と緑6番め:青7番め:茶8-11番め:ピンク、紫、オレンジ、グレイ 原語では以下のとおりです。 Stage I: Dark-cool and light-warm (this covers a larger set of colors than English “black” and “white”.)Stage II: RedStage III: Either green or yellowStage IV: Both gre
データ可視化の有用性を示すために、 Anscombe’s Quartetが参照されることがよくあります。 Anscombe’s Quartet これは何かというと、要約統計量(平均、標準偏差、相関)が同一のデータセット4つが、実際に散布図として可視化してみると全く異なる姿を描くところから、要約統計量が同一もしくは近似していても、まずは一度は可視化してみるべし、というお話です。 ここで、発想を逆さまにして、要約統計量が小数点2桁まで同一でありながら、散布図化してみると様々な視覚的特徴を描くデータセットを生成するアルゴリズムを考えた人がいます。 その名も The Datasaurus Dozen(12匹のデータ・ザウルス)。恐竜がモチーフになっているのは、Alberto Cairo氏のいたずらのような楽しめる投稿記事に由来します。 どうやっているのか 共通の要約統計量を持つデータセットをゼロベ
内閣府委託事業の一部として、2019年10月ごろに筆者が実施したリサーチレポートです。一般公開の許可をいただけましたので共有します。何かしらお役に立ちましたら幸いです。 目次 自メディアでのコミュニケーション民間のデザイナーを活用するオープンイノベーション民間サービスガイドライン整備行政が考えるデータビジュアライゼーションの価値データビジュアライゼーションの活用提案
国立国会図書館 初のデータビジュアライゼーションイベントが開催されます AIによる音声の自動文字起こし(トランスクライブ)、良いサービスが続々登場しています。英語にも当然対応しているので、特に海外のカンファレンスに参加される方には強い味方になります。 国立国会図書館 初のデータビジュアライゼーションイベントが開催されます。 国会図書館にはデータがたくさん 国会図書館には収蔵している書籍に関するデータもあるのですが、今回は「ウェブサイト」がテーマとなっています。 国会図書館では、15年前よりウェブページのアーカイブをおこなっており、その結果はWARPというウェブサービスとして公開されています。 Warp – 国立国会図書館インターネット資料収集保存事業 データを探しだそう 今回はこれらの中から、地方自治体ウェブサイトのメタデータなどを使って、データ・ビジュアライゼーションを行います。今回のイ
D3.jsでレスポンシブ・レイアウトを 最近はウェブの閲覧環境が多様化し、PCとモバイルでは画面解像度が全くことなります。 D3.jsでなにかを作る際、ワンソースで多様な閲覧環境に対応するための、レスポンシブ・レイアウト対応方法の一つを以下に紹介します。 D3.jsはSVGを使っている そこで、SVGが標準でサポートしている属性を使います。 個別の要素の大きさをすべて調整するのは大変なので、一番親要素のSVGの大きさを変更することで対応することにします。 viewBoxとpreserveAspectRatioの設定 viewBoxとpreserveAspectRatioという属性の設定をします。 これはSVGが拡大表示されたときの振る舞いを決定するものです。 SVGのviewBox属性が分かり辛い 座標系, 変換, 単位 – SVG 1.1 (第2版)
OpenVis Conference 2014 Part 2: Keynote Day 2 2. John Resig: Analyzing Art Data for Fun and Profit 二日目のキーノートスピーカーは言わずと知れた著名ライブラリjQueryの作者、John Resigでした。彼はJavaScript関連の本を何冊も執筆している有名なJavaScriptハッカーですが、他方、非常に熱心な日本文化、特に浮世絵のファンとしての一面も持っています。彼のキーノートは、まさにその両面が融合された非常に興味深いものでした。 講演の様子(YouTubeへのリンク) John Resig - Analyzing Art Data for Fun and Profit 日本文化と浮世絵 日本の絵画について。私(Resig)は日本絵画の大ファンであり、文化についても個人的に研究してい
OpenVis Conference 2014 Part 1: Keynote はじめに 私は最近、自分が働く分野(生物学関連のデータの解析と可視化)に間接的に関わる分野で起こっている様々な先端を覗いてみよう、と言うテーマの元に全米各地のカンファレンスやワークショップに参加しています。私は研究者ではなく、彼らが必要とする計算機環境を提供するのが仕事であるため、重要なのは実践的であることです。従って参加するのは主に実践者(practitioner)向けのテック系カンファレンスと言うことになります。 今回はアメリカ東海岸マサチューセッツ州ボストンのケンブリッジ(MITやハーバードのあるエリアです)で行われた、OpenVis Confと言うカンファレンスに参加してきました。これは可視化ソフトウェアの開発者やデザイナー、データ分析を行う人々等、データ可視化分野の実務畑で働く人々のための会議です。従
Shapefile→GeoJSON→TopoJSON Shapefile(地理情報システムにおけるオープン標準ファイル形式)をウェブで使用可能なGeoJSONやTopoJSONへ変換するための手順をご紹介します。今回は都道府県ごとに分かれた日本地図を描画することをゴールにします。まずはShapefileからGeoJSONを生成し、その後GeoJSONからTopoJSONを生成することとします。 Shapefileを編集する 国土地理院「地球地図」からShapefileをダウンロードする 今回の目的から都道府県ごとの粒度のものがいいのですが、ないので市区町村ごとの粒度のものをダウンロードし、手元で修正することにします。「地球地図日本のデータ」から第2版ベクタ(2011年公開)行政界 Shapeファイルをダウンロードします。 QGISでShapefileを読み込む ここからQGISというアプ
[HTML5J 第47回HTML5とか勉強会] データ・ビジュアライゼーションの現況と実際 from Yuichi Yazaki 2014/04/18 (金) に西新宿ニフティさんで開催された、第47回HTML5とか勉強... 続きを読む
参加者がディスカッションの議題を持ち寄りunconferenceがスタートしました。実際のタイムテーブルはこのような感じです。 * http://visfest.com/d3unconf/ せっかくなので私も一つ提案してみました。**Network visualizations; d3 + sigma + Cytoscape etc.**と言うのが私の提案したセッションです。 実際のディスカッション 普通のカンファレンスとは異なり当日にテーマを決めるため、誰かがスライドを使って話すと言う事は無く、イーゼルパッドとペン、そしてラップトップを持ち寄り、そのテーマについて皆で話し合います。当然全て英語ですので、日本からも参加してみたいと言う方はここで尻込みしてしまうかもしれませんが、基本的に話を聞くだけのカンファレンスとはまた違った面白さもありますので、機会があればぜひ挑戦してみてください。各ト
たとえばある変数の値が350の場合、ある棒グラフではY座標はいくつになるでしょうか。またはあるバブルチャートでは円の直径はいくつになるでしょうか。 インプットとしてのデータセットが持つ数値体系や幅(最小値〜最大値)などは、たいていアウトプット先の例えば液晶ディスプレイなどとは数値体系や幅(例えば表示領域など)が異なるため、両者をつなぐための方法論が必要になります。視覚化される要素の座標や大きさだけではなく、色や数値ではない例えばカテゴリーなどにも同様の手法が適用可能です。 Processingではmap、D3ではscaleという機能でまとめられています。しかしここには「正規化」という概念が隠されています。正規化という言葉にはいくつかの意味があり、ここではベクトルにおける正規化のことを指します。 その変数が含まれるデータセット全体(もしくは基準とすべき)最小値〜最大値の幅の中で、どの辺りにあ
Keiichiro Ono UC, San Diego School of Medicine Cytoscape Consortium はじめに まず自己紹介をさせていただきます。私はアメリカ西海岸、カリフォルニア州の最南端に位置するサンディエゴ在住のソフトウェア開発者です。カリフォルニア大学サンディエゴ校(UCSD)と言う大学の医学部で、生物学者や医師に混じって彼らが研究で必要とする各種ツールを開発しております。分野としてはbioinformaticsと呼ばれるものです。 先週の土曜日(3/29/2014)、サンフランシスコにあるGitHub本社にて行われたd3.unconfというD3.jsや可視化周辺の実務的な話題を扱う会議がありました。Cesar Chavez Dayで三連休だと言うこともあり1、私にとってはちょうどいいタイミングでしたので、久しぶりにサンフランシスコまで足を伸ばして
去年(2013年)クラスカで行われたFITC Tokyoに参加してきて、最も印象深かった話の一つが、Kyle McDonaldの ‘How to Give Everything Away’(あらゆるものを公開する方法)という話でしたので、ご紹介させてください。 FITC2013‘How to Give Everything Away’(あらゆるものを公開する方法)Kyle McDonald | FITC2013 公式サイトでは ‘give away’ を「公開する」と訳してるんですが「プレゼントしてしまう」とか、英英辞書ひくと「うっかり誰かが優位性を持つことができるように」というニュアンスもあるようです。言葉の並びをみると差し出すことによって自分から遠ざける(ざかる)というニュアンスもありそうです。 そして、何を ‘give away’ するのかとして具体的には、アイデアを共有すること、自
2013年12月20日、「データカタログサイト試行版」として、data.go.jpが開設されました。 「各府省の保有データをオープンデータとして利用できる場をつくり、データの提供側・利用側双方にオープンデータのイメージを分かりやすく示すことを目的としています。」とのことで、「日本のオープンデータ憲章アクションプラン」に基づいたものです。 SNSを検索すると「マシンリーダブルなデータじゃない」や「同種のサイトが多すぎる」という指摘がいくつか見られ、同感ではあるのですが、以下の二つのことが画期的だと考えています。 CC-BYライセンスが付与されていること(利用規約 第1条) 省庁横断でデータが集められていること まずは場作りと様子見であるようなので、ここで「まだできてない」じゃなくて「二歩進んだ」進んだと捉えて今後の動きにも注視していきたいところです。 さて、どんなデータが集められているのでし
先日(2013年11月15日)、日本科学未来館で開催された「G空間WAVE2013 gコンテンツワールド+ジオメディアサミット」内の「第12回ジオメディアサミット」にて「D3で切り開くジオ・データ・ビジュアライゼーションの可能性」というタイトルで本サイト執筆者の矢崎が登壇いたしました。 ジオメディアサミットは「日本最大の位置情報メディア向けフリーカンファレンスです。2008年より、年に2回のペースでジオメディアに関するカンファレンスを開催しており、年間400名以上の参加者が参加しています。」(公式サイト)というもので、Georepublic Japanの関さん、ゴーガの小山さん、マップコンシェルジュの古橋さんを中心に、活発に活動されています。当日の内容は以下のリンクを追ってみてください。 公式リンクリスト ジオメディアサミット 第12回ジオメディアサミット 東京大学生産技術研究所 准教授
D3で切り開く ジオ・データ・ビジュアライゼーション の可能性 第12回 ジオメディアサミット〜ジオデータビジュライズの世界〜 Yuichi Yazaki / visualizing.jp / toy-by-algorithm.com 自己紹介 矢崎裕一 インターフェイス・デザイナー/コーダー/トイ・コンサルタント インフォグラフィック vs データ・ビジュアライゼーション インフォグラフィック 人が手作業かグラフィックアプリで描いている。 手元にあるデータの特性を作者が理解し、その特徴を最大化するために表現が選ばれる。 そのため、別のデータを使用して再作成するのが容易ではない。 表示についてのルールとその例外処理について作者以外の外部からすべてを推測することが難しい。 参照したデータとの関連性の証明が難しい。 インタラクションが(ほぼ)ない。 あるデータセットが、予め用意されたアルゴリズ
ブラウザー上でデータビジュアライゼーションをやる場合にどの技術を使うべきなのか。そんなテーマでTwitter社でVisual Analysis & Insights teamのMiguel Rios氏が、今年5月にボストンのOpenVis Conferenceで講演しました。 講演での順番とはちょうど逆になりますが、話の流れがわかりやすい順番に構成します。 主にブラウザーのレンダリングの仕方が、DOM構造を残した状態なのか、そうでなく1つのDOM要素(canvas要素)の中にすべて描画するのか、という点を切り口に、主要な実装方法であるHTML/CSS、SVG、HTML5 Canvas、WebGLを取り上げ、整理しています。 実装にとりかかる前に明らかにすべきこと 要素はどのくらいの数になるのかそれらの要素はどのくらい複雑な形をしているか、また配置するかどの程度インタラクティブ性を持たせるか
U.K.で利用されている、民間企業ZOEによる COVID Symptom Tracker というアプリがあります。これは体温、疲れやコロナウイルス感染の可能性のある他の症状を含む健康状態を日常的に記録するアプリで、利用 […]
このページを最初にブックマークしてみませんか?
『Visualizing.JP』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く