RadarChart questions

[omatrot]

Hi @wuxudong, I have a bunch of questions about the RadarChart.

I have modified the RadarChart sample.

1. I'd like to draw full circles on dataset values. On the blue line in the screenshot below.
2. I'd like to draw grid lines only on x axis and set its color to black (now red) and get rid of the scale values on the y axis and set line color to black.

Screenshots

Here is what I have right now:

Data and config

The state is the following:

{
        data: {
          $set: {
            dataSets: [
              {
                values: [
                  { value: 1 },
                  { value: 1 },
                  { value: 1 },
                  { value: 1 },
                  { value: 1 },
                  { value: 1 },
                  { value: 1 }
                ],
                label: "Too High",
                config: {
                  color: processColor("#000000"),
                  drawFilled: true,
                  fillColor: processColor("#D9C5C5"),
                  fillAlpha: 100,
                  lineWidth: 0,
                  drawValues: false
                }
              },
              {
                values: [
                  { value: 0.75 },
                  { value: 0.75 },
                  { value: 0.75 },
                  { value: 0.75 },
                  { value: 0.75 },
                  { value: 0.75 },
                  { value: 0.75 }
                ],
                label: "High",
                config: {
                  color: processColor("#000000"),
                  drawFilled: true,
                  fillColor: processColor("#F1DB93"),
                  fillAlpha: 100,
                  lineWidth: 0,
                  drawValues: false
                }
              },
              {
                values: [
                  { value: 0.5 },
                  { value: 0.5 },
                  { value: 0.5 },
                  { value: 0.5 },
                  { value: 0.5 },
                  { value: 0.5 },
                  { value: 0.5 }
                ],
                label: "OK",
                config: {
                  color: processColor("#000000"),
                  drawFilled: true,
                  fillColor: processColor("#CADFB8"),
                  fillAlpha: 100,
                  lineWidth: 0,
                  drawValues: false
                }
              },
              {
                values: [
                  { value: 0.25 },
                  { value: 0.25 },
                  { value: 0.25 },
                  { value: 0.25 },
                  { value: 0.25 },
                  { value: 0.25 },
                  { value: 0.25 }
                ],
                label: "Too Low",
                config: {
                  color: processColor("#000000"),
                  drawFilled: true,
                  fillColor: processColor("#D9C5C5"),
                  fillAlpha: 100,
                  lineWidth: 0,
                  drawValues: false
                }
              },
              {
                values: [
                  { value: 0.5 },
                  { value: 0.5 },
                  { value: 0.5 },
                  { value: 0.5 },
                  { value: 0.5 },
                  { value: 0.5 },
                  { value: 0.5 }
                ],
                label: "DS 1",
                config: {
                  color: processColor("#0022F5"),
                  lineWidth: 2,
                  drawValues: false,
                  drawCircles: true,
                  circleColor: processColor("#0022F5"),
                  drawCircleHole: false,
                }
              }
            ]
          }
        },
        xAxis: {
          $set: {
            valueFormatter: ["PRV", "HR", "RR", "O2", "E.A.", "ASI", "PAI"]
          }
        },
        yAxis: {
          $set: {
            axisMinimum: 0,
            axisMaximum: 1
          }
        }
      }

And the control props:

<RadarChart
            style={styles.chart}
            data={this.state.data}
            xAxis={this.state.xAxis}
            yAxis={this.state.yAxis}
            chartDescription={{ text: "" }}
            legend={this.state.legend}
            drawWeb={true}
            webLineWidth={0}
            webLineWidthInner={1}
            webAlpha={255}
            webColor={processColor("red")}
            webColorInner={processColor("green")}
            skipWebLineCount={0}
            onSelect={this.handleSelect.bind(this)}
            onChange={event => console.log(event.nativeEvent)}
            rotationAngle={-115}
          />

Steps to Reproduce the Problem

It seems that:

                  drawCircles: true,
                  circleColor: processColor("#0022F5"),
                  drawCircleHole: false,

Has no effect regarding the circles.

I do not know what to do with the y scale.

Any help appreciated.

[omatrot]

About the "inner-web" lines: After reviewing the code of MPAndroid Chart, I've made a pull request to include a new property webAlphaInner on RadarChart. I'll do a pull request on the same change on the iOS library and I'm ready to create a pull request here.