GitHub - docsifyjs/docsify: 🃏 A magical documentation site generator.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
Front-End Engineering at Qumulo: React + D3.js
Hybrid / On-PremServer QQumulo CoreDeploymentsPublic CloudHybrid CloudPrivate CloudIndustriesMedia & EntertainmentHealthcareGovernmentHigher EducationFederalState and LocalCommon Use CasesCloud MigrationVideo SurveillanceVideo ProductionData ProtectionAnalyticsView All5X Gartner Magic Quadrant LeaderDiscover why we're a 5x consecutive leader Learn more Get Started ▼Contact UsContact Usinfo@qumulo.
Welcome to Bokeh — Bokeh documentation
Bokeh documentation# Bokeh is a Python library for creating interactive visualizations for modern web browsers. It helps you build beautiful graphics, ranging from simple plots to complex dashboards with streaming datasets. With Bokeh, you can create JavaScript-powered visualizations without writing any JavaScript yourself. Finding the right documentation resources# Bokeh’s documentation consists
dimple - A simple charting API for d3 data visualisations
An object-oriented API for business analytics powered by d3. Tweet Libraries Full Javascript Library With Comments Minified Javascript Library Zip File Tar Ball Resources Examples Advanced Examples View On GitHub Full API Documentation Simply Powerful The aim of dimple is to open up the power and flexibility of d3 to analysts. It aims to give a gentle learning curve and minimal code to achieve som
D3.jsにあてはまらないこと | POSTD
最近D3.jsをかなりいじってみました。APIをあれこれ調べ、すこし複雑なチャートを構築した後、長い間D3を誤解していたことに気づきました。それは私だけではありません。友達と話してみると、彼らもD3について勘違いをしています。そこで、よくある誤解のいくつかをはっきりとさせるために、この記事を書く事にしました。 D3はチャート・ライブラリではありません D3のホームページに行くと、たくさんの素晴らしいチャートとビジュアライゼーションを見ることができます。しかし、D3は、 Highcharts や Chart.js あるいは Google Charts のようなチャート・ライブラリではありません。ただ単に、データセットを受け渡すことや、必要なチャートのタイプ指定、凝ったチャートを入手することはできません。D3はそれよりもずっと低レベルなのです。D3上に構築されたチャート・ライブラリでは、たとえ
D3.jsで折れ線グラフをシンプルに引く - Qiita
tumblrのActivityを見ていて、こういうのって、D3.js使えばできるのかなと思って試してみました。 tumblrのActivityの折れ線グラフ: 円とか棒グラフはシンプルなサンプルがあるんですが、折れ線グラフはやたらと重厚長大なサンプルしか見当たらなかったので、練習を兼ねて。 D3はデータセットの仕方が独特で、クセをつかめば面白そうです。 やりたいこと Activityは、過去1日単位のNote数らしいのですが、直接ソースを見てみると、[ 2,0,0,0,0,0,0,0,1,1 ]というように、過去数日間のNote数をそのまま配列にしているようでした。 今回は同じように、過去のNote数っぽいデータを折れ線グラフにしてみます。 サンプル ファイルにコピペして保存して、ブラウザから呼び出すと動作します。 Chromeで確認しました。 <!DOCTYPE html> <meta
D3.jsの使い方とグラフを作成するサンプル ｜ Tips Note by TAM
javascriptのライブラリ「D3.js」について調べてみました。 ■ 公式 D3.js - Data-Driven Documents ■ 日本語訳 D3.js - 日本語ドキュメント D3（Data Driven Document）.jsとは D3.jsとは、JSON、XML、CSV、タブ区切りテキスト、javascriptの配列などの 様々な形式のデータを可視化する時に便利なライブラリで、下記のような特徴があります。 ・データに基づいてドキュメントを操作する。 ＝データドリブン（データ駆動） ・データの表現に必要な変換は行うが、表現そのものは直接行わない。 ⇒表現は制作者に委ねられていますが、そのために複雑な表現が可能になっています。 ⇒表現には主にSVGを使用します。 ・モダンブラウザでの動作を前提としている。 ⇒標準では古いブラウザはサポートしない。（IEは9以上） ・jQu
2時間縛りでd3.js挑戦してみた - mizchi's blog
何この記事 あんちべという人から無茶ぶりがきたので対応した mizchi、d3ブログ書いてくれた呑む— 3D円グラフ皆殺し (@AntiBayesian) 2014, 3月 2 @AntiBayesian D3まだ極めてないです— 高意識エネルギー (@mizchi) 2014, 3月 2 @mizchi 2時間やろう、早く極めたまえ— 3D円グラフ皆殺し (@AntiBayesian) 2014, 3月 2 @AntiBayesian おっしゃ待ってろ— 高意識エネルギー (@mizchi) 2014, 3月 2 前提 よく誤解されるんですが、D3.jsはグラフ描画ツールではなく、JavaScriptでSVGを生成するためのjQuery風DSLで、DSLとはいえかなりローレベルなライブラリです。SVGはベクタグラフィックスを生成する規格。ブラウザ上のSVGは、図形を書けるDOMであり、他
多次元解析のためのチャートライブラリ DC.js
d3.js Advent Calendar 2013の25日目です。皆様のおかげで全部埋めることができて良かったです。 今日はDC.jsという多次元解析のためのチャートライブラリをご紹介します。ちなみにこれはD3の情報ソースという5日目の記事で紹介したDashing D3.jsで最近紹介されていて知りました。 DC.jsによるダッシュボードサンプル DC.jsはサイトを見ていただければどういうものか分かると思いますが、 複数のチャートにまたがって、データのフィルタが可能なチャートライブラリです。デモサイトのそれぞれのチャートを操作すると他のチャートもそれに従ってダイナミックに表示が更新されます。 DC.jsはCrossfilterという配列のフィルタ処理を行うライブラリとD3.jsに依存しています。CrossfilterはSquareというiPhoneをカードリーダーにするハードウェア、サ
D3.jsとFabric.jsを使ってcanvasに描画する
d3.js Advent Calendar 2013 4日目の参加記事です。 以前も、Fabric.jsについては書いたことがあるのですが、D3とFabricの組み合わせにはいろいろな可能性を感じるので、布教のつもりで改めて記事にしたいと思います。 Fabricは、HTML5のcanvas要素を使いやすくするJavaScriptのグラフィックライブラリです。 最近では、Canvas は、私たちが、全く 驚くべき グラフィックス をウェブ上で作ることを可能にしました。しかし、 CanvasのAPIが提供するのは、残念ながら低水準です。 もし、私たちが単に基本的な図形を canvas上にほとんど描きたいと思わず、そのことを忘れてしまえば別ですが、 どんな形にせよインタラクションが必要になったり、 いかなる点であれ、絵の変更が必要になったり、もっと複雑な図形を 描くことが必要になったら、状況は一
D3.js の Data-Driven な DOM 操作がおもしろい
D3.js は「ビジュアライズ用のライブラリー」だと紹介されがちなんだけども、意外にも D3.js にはグラフを描画する機能がない。 D3.js のトップページには次のように書いてある。 D3.js はデータからドキュメントを生成するためのライブラリーです。D3 は HTML, SVG, CSS を使ってデータに命を吹き込みます。Web 標準を重要視しているので、独占的なフレームワークに縛られません。強力なビジュアライズ用のコンポーネントと data-driven な DOM 操作手順を組み合わすことで、モダン ブラウザーの能力を最大限に活用できます。 D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG
タッチ操作に対応した画像ビューワーをJavaScriptで作るならD3.jsが便利
スマホやタブレットで写真を表示していると、ピンチでズームしたり、ドラッグで移動したりができて便利なので、あれを Web 上で実現してみたくなった。 最近のブラウザーでは touchstart や touchmove イベントでタッチ情報を取れたり、イベントの touches でマルチタッチを扱えたりするので、実現するための基盤はそろっている。 適当なライブラリーがあるかと思って探してみたが、意外と苦労してしまった。 Hammer.js が使えない タッチを扱うためのライブラリーとしては Hammer.js がメジャーらしい。スワイプ・ピンチ・ドラッグなど、各種イベントにも対応していて、これを使えば一発解決してくれそうだ。 ところが、画像ビューワーを作るには不向きだった。困ったのは次の 2 点。 ピンチやドラッグは個別には動くが、組み合わせたときに「表示位置」と「倍率」の関係を自前で計算する
無料のサービスを使ってHubotで動的に画像を生成して返す - Qiita
Hubotのことを知って、個人的に衝撃を受けたのが、「GitHub社内のDevOpsを支えるツール「Boxen」と「Hubot」（後編）～DevOps Day Tokyo 2013」という記事のこの画像でした。 botが画像を動的に作って返す…。これはぜひhubot触ってみないといけない、と思ったのでした。 目標 自宅の環境以外で、２４時間サーバが動いていて、いつでもhubotを呼び出せて、画像を生成する、ということが無料で出来る環境を目指します。 前提 いくつかキーワードが出てきますが、以下は知ってる前提で。 node hubot heroku また、冒頭の画像は、campfireというチャットサービス上での表示ですが、それもお金かかるので、hipchatという５人まで無料のチャットサービスを利用します。 探索 hubotはnode上で動いているので、nodeが使えるherokuがまず候
D3.jsで作成したグラフ(SVG)を画像として保存する - Tech-Sketch
先日公開した D3.jsをつかってData-Drivenにリッチなグラフやチャートを作成しよう の記事ではD3.jsをつかってグラフを作成しました。本記事ではD3.jsで作成したSVG形式のグラフをPNG形式の画像として保存する方法をご紹介します。 D3.jsにはCSVやJSONなど 様々なデータ形式を扱う為の便利なメソッド が用意されており、アプリケーションへの組み込みが容易です。しかしアプリケーションへの組み込みとなると、「X月X日の状態のグラフを保存しておきたい」、「グラフを資料に添付したい」といった要望も出てくるのではないでしょうか。 単純に画面のスクリーンショットを取得する以外では Phantom.js を利用してキャプチャを取得する方法や Apache Batik を利用してSVGを変換する方法などが考えられましたが、クライアントサイドだけで完結しない上、実装が少々手間です。
D3.jsでグラフを描いてみる - ワザノバ | wazanova
http://www.alexrothenberg.com/2014/01/06/learning-d3-by-building-a-chart.js.html1 comment | 0 pointsAlex Rothenbergが、GitHubグラフでおなじみのD3.jsの解説をしています。 今日は、D3.jsを使って、このようなグラフを描いてみる。D3.jsのポイントとしては、 データをDOM elementとバインディングする。 チャート、地図、配列など多くのAPIがある。 チャートなどをビジュアル化するにはSVGが適している。 Binding data to the DOM D3とはData-Driven Documentを意味し、データをDOM elementに同期する機能を提供してくれる。では早速見てみよう。 <script src="http://d3js.org/d3.v3
D3.jsとOpen Data〜その１地図を描画する - Qiita
この記事はD3.js Advent Calendar 2013の9日目です。Open Dataと大きなことを言いましたが、今回は行政データの基本のキであるところの地図を描画してみます。なわけで地図を描画するところがゴールです。 今回の完成図は下記です。国土交通省から神奈川県の行政区域データを取得しD3.jsで描画します。ついでにホームタウンとしているJリーグチーム毎に色塗りしてみました。(マリノスの最終節については触れるべからず！) サンプルページはこちら D3 Geo Projection D3.jsには地理描画機能がデフォルトで含まれており、さまざまな投影法によって地形データを描画することができます。 https://github.com/mbostock/d3/wiki/Geo-Projections この機能を使って地図を描画します データの入手 まずは国土交通省のページから行政区
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
D3.jsを使ったグラフを簡単に作成できるChromeアプリ「datamatic.io」 – GUNMA GIS GEEK
d3.js Advent Calendar 2013 - Adventar
http://daily.d3js.info/?p=339
D3.js メモ - 牌語備忘録 -pygo
