D3 and React - the future of charting components? - Binary Consulting. Data-Driven Documents (D3.js) is currently my favoured charting library for producing interactive SVG visualisations.
Sarah Mei » Why You Should Never Use MongoDB. Cut Two Pieces: Inkscape. Do you use Inkscape?
Did you know there is a built in feature to create calendars? If you don’t have Inkscape but would like to make a calendar go here and download the program (it is free). To create a calendar is very easy. To start open Extensions>Render>Calendar. Now you will see a new window with some more options. Gephi - The Open Graph Viz Platform. Www.jeromecukier.net/wp-content/uploads/2012/10/d3-cheat-sheet.pdf. Www.jeromecukier.net/wp-content/uploads/2012/10/d3-cheat-sheet.pdf. How Selections Work.
Any sufficiently advanced technology is indistinguishable from magic.
–Arthur C. Clarke In the past I have presented simplified descriptions of D3’s selections, providing only enough detail to get started. This article takes a more comprehensive approach; rather than saying how to use selections, I will explain how selections are implemented. This may take longer to read, but it should dispel any magic and help you master data-driven documents. The structure of this article may at first seem arbitrary. D3 is a visualization library, so this article incorporates visual explanations to accompany the text. Var array = ; Wherever possible, the code that generates the given selection appears immediately above the diagram. Let’s begin. #A Subclass of Array You were probably told that selections are arrays of DOM elements. #Grouping Elements. Hierarchy for D3.js.
Tutorials. Getting Started with D3: Safari Books Online. Learning D3 Part 1: Selections, Properties, Data. Update: I’m releasing a series of screencast tutorials on D3 at deveo.tv.
Source: Mike Bostock (click to start) D3.js Playground. Sorting a selection in d3.js disturbs the data-join. API Reference · mbostock/d3 Wiki. Wiki ▸ API Reference.
Chained Transitions. Selections. Arrays. Interactive Data Visualization for the Web. Contrary to what the name implies, D3 layouts do not, in fact, lay anything out for you on the screen.
Stacked Bar. Animations and transitions. That post originally appeared on visual.ly, I’m reproducing it here for clarity and ease of retrieval In interactive visualisation, there is the word reactive.
d3: scales, and color. In protovis, scales were super-useful in just about everything. That much hasn’t changed in d3, even though d3.scale is a bit different from pv.Scale. (do note that d3.scale is in lowercase for starters). Scales: the main idea Simply put: scales transform a number in a certain interval (called the domain) into a number in another interval (called the range). For instance, let’s suppose you know your data is always over 20 and always below 80. But what if you suddenly have more or less space? El Patrón de los Números Primos: Prime Number Patterns. By Jason Davies. For each natural number n, we draw a periodic curve starting from the origin, intersecting the x-axis at n and its multiples. The prime numbers are those that have been intersected by only two curves: the prime number itself and one.
Below the currently highlighted number, we also show its sum of divisors σ(n), and its aliquot sum s(n) = σ(n) - n, which indicate whether the number is prime, deficient, perfect or abundant. Brush Handles. Orthographic Shading. Lab and HCL Color Spaces. D3 supports CIELAB (Lab) and CIELCH (HCL) color spaces, which are designed for humans rather than computers. Lab and HCL color spaces are special in that the perceived difference between two colors is proportional to their Euclidean distance in color space. This special property, called perceptual uniformity, makes them ideal for accurate visual encoding of data. In contrast, the more familiar RGB and HSL color spaces distort data when used for visualization. Vis.