Y-Axis has wrong range in StackedBarChart
See original GitHub issueWhat 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:
Issue Analytics
- State:
- Created 5 years ago
- Comments:6 (3 by maintainers)
Top 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 >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
You are correct that the static function
extractDataPoints
doesn’t support complex data. I’ll fix this in the next releaseSnack example here: https://snack.expo.io/@vjsingh/yaxis-issue