Archive for tag: tutorial
2 January, 2012 (20:15) | d3, tips | By: jerome
Creating visualizations from static files is fine and dandy but sometimes you need to be able to access dynamic data. And some other times, you may want to somehow record interactions from your users. One way to do that is by interacting with a mySql database. Without further ado here is the demo: How does [...]
Tags: ajax, d3, database, mysql, php, tutorial, xhr | 8 comments
11 August, 2011 (12:03) | d3, protovis, tips | By: jerome
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 [...]
Tags: color, color palettes, d3, hsl, linear, logarithmic, ordinal, power, protovis, quantitative, rgb, scales, tutorial | 3 comments
9 August, 2011 (14:49) | d3, protovis, tips | By: jerome
From data to graphics d3 and protovis are built around the same principle. Take data, put it into an array, and for each element of data a graphical object can be created, whose properties are derived from the data that was provided. Only d3 and protovis have a slightly different way of adding those graphical [...]
Tags: charts, d3, javascript, protovis, selection, svg, tutorial | 7 comments
8 August, 2011 (16:47) | d3, protovis | By: jerome
You’ve spent some time learning protovis only to find that its development is halted as authors have switched to work on d3. Have your efforts all been in vain? Fear not! This series of posts will help you adapt to d3 with a protovis background. Before we go anywhere further, let me say that these [...]
Tags: d3, protovis, svg, tutorial | 2 comments
11 February, 2011 (20:11) | charts, data visualization, protovis, tips | By: jerome
previous: reshaping complex arrays (4/5) Working with layouts In this final part, we’re going to look at how we can shape our data to use the protovis built-in layouts such as stacked areas, treemaps or force-directed graphs. This is not a tutorial on how to use layouts stricto sensu, and I advise anyone interested to [...]
Tags: arc diagrams, force-directed graphs, graphs, layouts, matrix diagrams, network, protovis, stacked areas, stacked bars, stacked columns, treemaps, trees, tutorial | 3 comments
11 February, 2011 (02:40) | charts, data visualization, protovis, tips | By: jerome
Protovis, like Tableau, are based on the grammar of graphics framework. In a nutshell, in both environments, a chart designer can map visual attributes (such as x or y dimension, color, shape, etc.) to dimensions of data. The flat file which Becker’s Barley is based on can be used in Tableau public nearly as is. [...]
Tags: grammar of graphics, nesting, protovis, Tableau, tutorial | 1 comment
9 February, 2011 (19:08) | charts, data visualization, protovis, tips | By: jerome
Previous : Multi-dimensional arrays, inheritance and hierarchy Short interlude: what can be done with arrays in javascript? Now that we have a grasp on how arrays work and how they can be used in protovis, let’s take a step back and look at some very useful methods for working with arrays in standard javascript. Sorting [...]
Tags: arrays, javascript, protovis, tutorial | 6 comments
8 February, 2011 (19:51) | charts, data visualization, protovis, tips, Uncategorized | By: jerome
Previous post: simple arrays Multi-dimensional arrays, associative arrays and protovis Even for a simple chart, chances are that you’ll have more than a single series of numbers to represent. For instance, you could have labels to describe what they mean, several series, and so on and so forth. So, let’s say we want to add [...]
Tags: hierarchy, inheritance, protovis, tutorial | 5 comments
7 February, 2011 (19:41) | data visualization, protovis, tips | By: jerome
When I started using protovis I had only a very basic knowledge of javascript, which in theory isn’t a problem as protovis is meant to be learned by example, and as it has its own logic and structure which is different from typical javascript code. So I started by looking and modifying examples which was [...]
Tags: arrays, data, protovis, tutorial | 11 comments