Column Chart: No bar shown for (relatively) small negative numbers

[DavidMoerman]

Describe the bug If a chart's dataset contains large (positive or negative) numbers, and a negative value that is relatively small compared to the other numbers.

To Reproduce I have altered the column.demo.ts file from the enterprise-ng project, but I am pretty sure the problem is not related to Angular. The first column has a negative value of -1, the second a large value (100000), and the last a value of positive 1. Both the second and third columns are shown; the first isn't:

When checking the values in the Chrome Developer Tools, the third column has a height of 2. I've noticed that this value seems to be the minimum threshold. Increasing the value of the second bar doesn't make the third bar smaller. The first bar, displaying the negative -1, however, has a height of a tiny fraction and is therefore not visible. I have provided a screenshot of the html elements as well:

By the way, in this particular example, the third bar - although shown - is slightly misplaced under the axis line. If the first value is made positive as well, the placement of all bars is above the axis line (as it should be).

Steps to reproduce the behavior: In the enterprise-ng project, replace the column.demo.ts file with the provided example. The only thing changed is the columnData structure:

  public columnData = [{
    data: [{
      name: 'Automotive',
      shortName: 'Auto',
      abbrName: 'A',
      value: -1,
    }, {
      name: 'Distribution',
      shortName: 'Dist',
      abbrName: 'D',
      value: 100000
    }, {
      name: 'Equipment',
      shortName: 'Equip',
      abbrName: 'E',
      value: 0
    }]
  }];

Expected behavior Negative values should be represented in the same way as positive values; so if the latter get a minimum height of 2, the negative values should too.

Version 4.97.0

Additional context It could be related to the problem mentioned in issue #8854.

[tmcconechy]

You could try the positive-negative chart as well. I think the issue is in the domain (way it scales between two values). So unsure if its fixable.

Also could try to influence the domain with minValue https://github.com/infor-design/enterprise/blob/main/app/views/components/column/example-domain-change.html#L43

Or number of ticks https://github.com/infor-design/enterprise/blob/main/app/views/components/column/test-axis-y-format-integer.html#L65

Logged to backlog

[DavidMoerman]

minValue doesn't seem to work with negative values, it is cancelled out in this line: y.domain([yMin < 0 ? yMin : self.settings.minValue || 0, d3.max(self.settings.isStacked ? maxesStacked : maxes)]).nice();

[tmcconechy]

@DavidMoerman ok i wasnt sure it would work but was worth a try