0

I ran into the exact same issue @SamSelikoff ran into here Update the y-axis of a brushed area chart. The example he was working off of was a single data series area chart here http://bl.ocks.org/mbostock/1667367 while i'm working on a multi-line chart like the one here http://bl.ocks.org/mbostock/3884955.

How do i adapt a data filter for the more complex data mapping in the multi line chart? i.e. with data mapped like so

var cities = color.domain().map(function(name) {
return {
  name: name,
  values: data.map(function(d) {
    return {date: d.date, temperature: +d[name]};
  })
};
});

And the y.domain set up like so

y.domain([
d3.min(cities, function(c) { return d3.min(c.values, function(v) { return v.temperature; }); }),
d3.max(cities, function(c) { return d3.max(c.values, function(v) { return v.temperature; }); })
 ]);

How do i create a filter similar to this (Sam's univariate data solution)

// Use x.domain to filter the data, then find the max and min duration of this new set, then set y.domain to that
x.domain(brush.empty() ? x2.domain() : brush.extent());
var dataFiltered = data.filter(function(d, i) {
   if ( (d.date >= x.domain()[0]) && (d.date <= x.domain()[1]) ) {
      return d.duration;
   }
})
y.domain([0, d3.max(dataFiltered.map(function(d) { return d.duration; }))]);

I've tried putting a filter within the same syntax used for the min and max of the full data set's y-axis like so

x.domain(brush.empty() ? x2.domain() : brush.extent());
var testMin = d3.min(cities.filter(function(c) { return c.values, function(v) {if ( (v.dates >= x.domain()[0]) && (v.dates <= x.domain()[1]) ){ return v.temperature; } }}))

No luck so far. Any ideas?

Community
  • 1
  • 1
WittyID
  • 609
  • 2
  • 6
  • 15

0 Answers0