timqian/chart.xkcd

Negative numbers clipped in StackedBar

unhammer opened this issue · 2 comments

Describe the bug

Negative numbers in datasets are not shown in StackedBar, mess up labels, or end up going below the origin even for the "positive stack"

Screenshot
If applicable, add screenshots to help explain your problem.
bilde

How to reproduce

<svg class="chart"></svg>
<script src="https://cdn.jsdelivr.net/npm/chart.xkcd@1.1/dist/chart.xkcd.min.js"></script>
<script>
  const svg = document.querySelector('.chart');

  new chartXkcd.StackedBar(svg, {
     data: {
       labels: ["normal","-20","-30"],
      datasets: [{
        label: 'Red',
        data: [10,-20,-30],
      }, {
        label: 'Blue',
        data: [20,20,20],
      }],
     }
  });
</script>

or see https://jsfiddle.net/3dpbg241/

Additional context

I'd expect at least the positive dataset to stay above the line, and the labels to match up. Preferably, I'd get the "Red" in the example going below the line, and "Blue" above, and the Ylabel line would continue below the origin.

Thanks @unhammer I will look into it when I got time

截屏2020-07-25 13 49 21

I don't think this one works well... Maybe I should try another way.

NOTE

I have tested every kind of graph. Only the two "Bar charts" and "Radar" have this bug.

NOTE

I think to fix the disappearance, we can add a customizable padding on the y-axis.