Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Stack mixin charts' y-domain is always [0, n] when elasticY(true) #667

@mtraynham

Description

@mtraynham
Problem

The series chart (which is a composite mixin) draws all stack mixin children (typically line charts) incorrectly when elasticY is set to true. I would expect the highest value to be at the top of the chart and the lowest value to be at the bottom, flush with the axis.

Here is a screen of the issue:
screenshot from 2014-08-07 15 39 38

Because the series chart (composite mixin) will add multiple child charts, the stack mixin is effectively only rendering n number of single group stacks (where the data point has value {y: value, y0: 0}. The issue arises when accumulating the y-axis min, in the child's yAxisMin function of stack-mixin.js:

    _chart.yAxisMin = function () {
        var min = d3.min(flattenStack(), function (p) {
            // Because y is typically greater than y0
            // (which in our case is 0), this returns 0.
            return (p.y + p.y0 < p.y0) ? (p.y + p.y0) : p.y0;
        });
        return dc.utils.subtract(min, _chart.yAxisPadding());
    };
Workaround

A workaround is changing the series-chart's _chartFunction to properly return the min value for the group, using the chart method:

var chart = new dc.seriesChart("#chart1", "group1")
      .chart(function (c) {
          var child = dc.lineChart(c);
          dc.override(child, 'yAxisMin', function () {
              var min = d3.min(child.data(), function (layer) {
                  return d3.min(layer.values, function (p) {
                      return p.y + p.y0;
                  });
              });
              return dc.utils.subtract(min, child.yAxisPadding());
          });
          return child;
      });

screenshot from 2014-08-07 15 38 53

Thoughts

The more I think about it, the less I like the fact that series is a chart type... It really only applies to line charts. It would be better if the stackMixin handled these cases, such as:

  • a seriesAccessor function
  • lines (stacked, series) & bars (stacked, grouped)
    • the animation between these seems to be a big missing feature

The list of bugs around stack & series has been growing for a while, so they definitely deserve some attention and it would be nice to provide an all in one true stack/series/group mixin.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions