StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>D3 and NVD3 don't have a function to do this. Your best bet is to insert your missing values. Some CoffeeScript that uses some Underscore utilities, but d3 had many of the same functions, so you shouldn't need to necessarily depend on Underscore if you don't need it. First you get the list of domain values, then you insert your missing values.</p> <p>The method <em>getDomainValues</em> takes data and a dimensions (a key) and pulls all the values to get the set of domain values. If you had data like:</p> <pre><code> key : a values : [ {x: 4, y:1}, {x: 5, y:1}, {x: 7, y:1} ] key : b values : [ {x: 1, y:10}, {x: 2, y:5}, {x: 3, y:0} ] </code></pre> <p>It would return:</p> <pre><code>[1,2,3,4,5,7] </code></pre> <p><br></p> <pre><code>getDomainValues = (data, dimension) -> _.uniq _.flatten _.map data, (item) -> _.pluck(item.values, dimension) </code></pre> <hr> <p>The method <em>insertValues</em> inserts default values (most commonly 0) for dimension values not present in the values array. It sorts by dimension. If you had data like:</p> <pre><code> key : a values : [ {x: 4, y:1}, {x: 2, y:1}, {x: 1, y:1} ] </code></pre> <p>And supplied a domain [0, 1,2,3,4,5] and a value of -10 you'd get:</p> <pre><code> key : a values : [ {x: 0, y:-10}, {x: 1, y:1}, {x: 2, y:1}, {x: 3, y:-10}, {x: 4, y:1}, {x: 5, y: -10}] </code></pre> <p><br></p> <pre><code>insertValues = (data, value, dimension, metric, domain)-> defaults = {} for item in domain v = {} v[dimension] = item v[metric] = value defaults[item] = v _.each data, (item) -> vals = _.groupBy( item.values, (i) -> i[dimension]) vals = _.flatten _.values _.defaults vals, defaults vals = _.sortBy vals, dimension item.values = vals data </code></pre> <p>So you might call them like this:</p> <pre><code>data = [ { key:"line 1", values: [ {x:1, y:1}, {x:2, y:2} ] }, { key:"line 2" , values: [ {x:1, y:1}, {x:2, y:2}, {x:3, y:3} ] } ] domain = getDomainValues data, 'x' filledData = insertValues data, 0, 'x', 'y', domain </code></pre> <p>See it in JavaScript: <a href="https://gist.github.com/FaKod/e6724675e4ebaf9f8fa4" rel="nofollow">https://gist.github.com/FaKod/e6724675e4ebaf9f8fa4</a></p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload