サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
iPhone 16
observablehq.com
Observable Framework is an open-source static site generator for data apps, dashboards, reports, and more. Framework includes a preview server for local development, and a command-line interface for automating builds & deploys. You write simple Markdown pages — with interactive charts and inputs in reactive JavaScript, and with data snapshots generated by loaders in any programming language (SQL,
Experiment and prototype by building visualizations in live JavaScript notebooks. Collaborate with your team and decide which concepts to build out.
Today we’re launching Observable 2.0 with a bold new vision: an open-source static site generator for building fast, beautiful data apps, dashboards, and reports. Our mission is to help teams communicate more effectively with data. Effective presentation of data is critical for deep insight, nuanced understanding, and informed decisions. Observable notebooks are great for ephemeral, ad hoc data ex
Visualization toolmaker. Co-founder @observablehq. Creator @d3. Former @nytgraphics. Pronounced BOSS-tock.
Observable PlotThe JavaScript library for exploratory data visualization Create expressive charts with concise code
Software engineer, available for freelance work! • he/him/his
MIT CS Graduate student in MIT Visualization Group. Previously undergraduate member of @uwplse and @uwsampl.
Looking for a good D3 example? Here’s a few (okay, …) to peruse. Animation D3’s data join, interpolators, and easings enable flexible animated transitions between views while preserving object constancy. Interaction D3’s low-level approach allows for performant incremental updates during interaction. And D3 supports popular interaction methods including dragging, brushing, and zooming. Analysis D3
Brush, drag, zoom events The new event system applies to listeners across the board, not only in d3-selection, but also in d3-drag, d3-brush and d3-zoom: Annex Thanks to Guillaume Levrier for suggestions.
Visualization toolmaker. Founder @observablehq. Creator @d3. Former @nytgraphics. Pronounced BOSS-tock.
SUGIMOTO TatsuoD3 Tutorial Japanese D3チュートリアル日本語版PublicD3 Tutorial Japanese D3チュートリアル日本語版Showing all 18 listings1.D3 チュートリアル 日本語版SUGIMOTO TatsuoMay 18, 2021• 62.D3 チュートリアル 01 : このチュートリアルについてSUGIMOTO TatsuoOct 29, 20183.D3 チュートリアル 02 : 基礎編SUGIMOTO TatsuoOct 15, 2018• 14.D3 チュートリアル 04 : 要素の追加SUGIMOTO TatsuoNov 12, 20185.D3 チュートリアル 05: メソッドのチェインSUGIMOTO TatsuoNov 12, 20186.D3 チュートリアル 06 : データのバインディング
This series of notebooks will guide you through your first steps with D3.js. Before we embark, it’s worth briefly considering: Why bother learning D3? And why learn here in Observable? For one, D3 is popular (200M downloads and 100K stars), so you’re in good company. There are plenty of community-developed resources, including tutorials, videos, classes, and books. And the D3 team has published hu
#DataScience #Visualization #AI @ox-cs @Alipay @antvis *Plothis
CSS Styles Config Params Animation aux Vis code Data Aux functions Code Libraries
Engineer at Mapbox, creator of Leaflet, algorithms geek, open source enthusiast, musician, father of twin girls, Ukrainian. 🇺🇦
Start building your own data visualizations from examples like this. Powering the world’s best data teams. Use Observable to explore your data, create visualizations, and share insights faster.
Observable offers a modern way to create powerful, performant, polyglot data apps built on open source. Deploy on Observable to share instantly, privately, and securely.
This network of character co-occurence in Les Misérables is positioned using D3’s force layout. Color represents arbitrary clusters in the data. Drag nodes below to better understand connections. See also a disconnected graph, a canvas version, and compare to WebCoLa. Data: Stanford Graph Base
This variation of a line chart uses a gradient to change the line color based on its y-value. For a related technique along the x-axis, see variable-color line. Using Observable Plot’s concise API, you can get a quick approximation of that chart (below). For a more elaborate solution with a gradient encoding, see this notebook.
A box-and-whisker plot shows summary statistics of a quantitative distribution. Here, the price distribution (y-axis) of a set of diamonds is plotted for a given range of carat values (x-axis).
This time-series chart shows the daily close of Apple stock. Data: Yahoo Finance
This chart shows the estimated population by age and U.S. state. Compare to horizontal stacked bars, normalized stacked bars, grouped bars and a dot plot. Data: American Community Survey
次のページ
このページを最初にブックマークしてみませんか?
『Observable: Build expressive charts and dashboards with code』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く