Skip to content

Instantly share code, notes, and snippets.

@Jpadilla1
Last active May 30, 2019 10:31
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save Jpadilla1/d3cb8d52b35ed825e87e to your computer and use it in GitHub Desktop.
react-native-ios-charts HorizontalBarChart example
import React, {
AppRegistry,
Component,
StyleSheet,
Text,
View
} from 'react-native';
import { HorizontalBarChart } from 'react-native-ios-charts';
class charts extends Component {
render() {
const config = {
dataSets: [{
values: [89.7, 20.7, 43.7, 54.7, 34.7, 16.7, 66.7, 86.7, 65.7, 76.7, 96.7, 106.7],
valueTextFontSize: 12
}],
backgroundColor: 'transparent',
labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Oct', 'Sep', 'Nov', 'Dec'],
showLegend: false,
minOffset: 20,
xAxis: {
axisLineWidth: 0,
position: 'bottom'
},
leftAxis: {
spaceTop: 0.18,
},
rightAxis: {
enabled: false,
drawGridLines: false
}
};
return (
<View style={styles.container}>
<HorizontalBarChart config={config} style={styles.chart}/>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'stretch',
backgroundColor: 'white',
paddingTop: 40,
paddingBottom: 40,
paddingLeft: 10,
paddingRight: 20
},
chart: {
flex: 1,
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment