question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Y-Axis has wrong range in StackedBarChart

See original GitHub issue

What is the problem?

I can’t display an X-Axis with correct values for a horizontal StackedBarChart.

What platform?

  • iOS React Native version: 0.55

Code to reproduce

     let colors = [ '#7b4173', '#a55194'];

      let data = [
        {
          label: 'One',
          apples: 5,
          oranges: 6
        },
        {
          label: 'Two',
          apples: 10,
          oranges: 20
        }
      ];
      let keys = ['apples', 'oranges'];

      return (
        <View style={{ height: 220 }}>
          <View style={{ height: 200, flexDirection: 'row' }}>
            <YAxis
                data={ data }
                contentInset={ { top: 30, bottom: 30 } }
                yAccessor={({ index }) => index}
                formatLabel={ (value, index) => {return data[index].label} }
                svg={{ fontSize: 10, fill: 'grey' }}
                numberOfTicks={ 1 }
                scale={scale.scaleBand}
            />
            <StackedBarChart
                style={{ flex: 1, marginLeft: 16}}
                keys={ keys }
                colors={ colors }
                data={ data }
                horizontal={ true }
                contentInset={ { top: 15, bottom: 15 } }
            />
          </View>
          <XAxis
              data={ StackedBarChart.extractDataPoints(data, keys) }
              contentInset={ { left: 20, right: 15 } }
              // formatLabel={ (value, index) => this._chartData[index].label }
              svg={{ fontSize: 6, fill: 'grey' }}
              scale={scale.scaleBand}
          />
        </View>)

I would expect the X-Axis to go from 0 to 30, but instead it is from 0 to 7: screenshot 2018-06-13 12 51 25

Issue Analytics

  • State:open
  • Created 5 years ago
  • Comments:6 (3 by maintainers)

github_iconTop GitHub Comments

2reactions
JesperLeklandcommented, Jun 25, 2018

You are correct that the static function extractDataPoints doesn’t support complex data. I’ll fix this in the next release

0reactions
vjsinghcommented, Jun 22, 2018
Read more comments on GitHub >

github_iconTop Results From Across the Web

chart.js - Unable to change y-axis value dynamically based on ...
To dynamically compute the ticks you need a couple things. A utility to precompute and find the maximum value in your data.
Read more >
How to change space between y-axis and first bar in a stacked ...
Is there a way to change the space before and after the bars (eg. make it smaller)? As far as I know with...
Read more >
Line and stacked column chart - Y-axis
Solved: Hello, I am trying to do a line and stacked column chart to compare revenue and cost. My axis is month. I...
Read more >
Getting Y-Axis %Cumulative to Display on Stacked Bar Chart ...
You have to create a nominal column of 1's, or a local data variable in graph builder, and drag that variable onto the...
Read more >
KB483224: Incorrect extreme values displayed for a bar chart.
In the new fix, the relevant attribute in the hierarchy is used to calculate the range of values for the y-axis for bar...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found