react-native-pathjs-charts icon indicating copy to clipboard operation
react-native-pathjs-charts copied to clipboard

Radar chart rings not centered

Open gilsonmandalogo opened this issue 8 years ago • 1 comments
trafficstars

Before filing an issue please ensure the following boxes are checked, if applicable:

  • [X] I have searched for existing issues
  • [X] I have provided detailed instructions that can reproduce the issue (including code and data necessary)

I can't do a centered radar chart rings: image

Code to reproduce:

I have compiled the example app too, and the result is same on radar screen. Anyway, below is my code to reproduce:

let data = [{
  "speed": 74,
  "balance": 29,
  "explosives": 40,
  "energy": 40,
  "flexibility": 30,
  "agility": 25,
  "endurance": 44
}];

const options = {
  width: 300,
  height: 300,
  margin: {
    top: 20,
    left: 20,
    right: 20,
    bottom: 20
  },
  fill: "#C21D1D",
  stroke: "#C21D1D",
  label: {
    fontFamily: 'Arial',
    fontSize: 14,
    fontWeight: true,
    fill: '#ECF0F1'
  }
};
return(
  <View>
    <Radar
      data={data}
      options={options}              
    />
  </View>
);

gilsonmandalogo avatar Oct 18 '17 19:10 gilsonmandalogo

removing the margin section should solve your issue

flochaz avatar Dec 14 '17 18:12 flochaz