как добавить атрибут id в radial-gauge в Reactionjs (или как установить 100% ширину и высоту для датчиков)

Question

Я использую холст-манометры в Reactjs. Когда я пытаюсь визуализировать прямой холст, он не рендерит холст, поэтому я использовал <RadialGauge units='km/h'> реагирующие компоненты. Здесь я не могу установить 100% высоту и ширину для датчиков. Я не хочу устанавливать как px. Установил следующий пакет npm install react-canvas-gauges

<RadialGauge
  id='mycanvas'
  units='rpm'
  title='x1000 RPM'
  width={200}>
</RadialGauge>

Фактический рабочий код со значением px

<Row>
   <Col md="12" xl="12">
   <Card>
      <CardBody className="dashboard-card-widgets" >
         <Row>
            <Col md="6" xl="6">
            <RadialGauge
            units='rpm'
            title='x1000 RPM'
            width={200}
            height={200}
            value={3}
            minValue={0}
            maxValue={8}
            majorTicks={['0', '1','2','3','4','5','6','7','8']}
            minorTicks={5}
            borders={false}
            strokeTicks={true}
            highlights={[{from: "6", to: "8", color: "rgba(200, 50, 50, .75)"}]}
            ColorPlate={'#fff'}
            borderShadowWidth={0}
            needleType={'arrow'}
            needleWidth={3}
            needleCircleSize={7}
            needleCircleOuter={true}
            needleCircleInner={false}
            animationDuration={1500}
            animationRule={'linear'}
            fontNumbersSize={30}
            ></RadialGauge>
            </Col>
         </Row>
      </CardBody>
   </Card>
   </Col>
</Row>

Ожидаемый результат в рендере:

<canvas id="mycanvs" width="100%" height="100%"></canvas>