d

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.

15 St Margarets, NY 10033
(+381) 11 123 4567
ouroffice@aware.com

 

KMF

Beautiful React Hook For Gauge Charts – use-gauge

A React hook to help you create beautiful, animated, SVG based gauges.

How to use it:

1. Install and import the use-gauge.

# Yarn
$ yarn add use-gauge
# NPM
$ npm i use-gauge
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { useGauge } from '../.';

2. Invoke the useGauge hook with the following parameters:

const {
  ticks,
  valueToAngle,
  angleToValue,
  getTickProps,
  getLabelProps,
  getArcProps,
  getNeedleProps,
  getSVGProps,
} = useGauge({
  startAngle: 90,// 0-360
  endAngle: 270
  numTicks, // the number of ticks
  diameter, // diameter of the gauge
  domain: [minValue, maxValue], // Min and max values for your gauge
});

Preview:

Download Details:

Author: mattrothenberg

Live Demo: View The Demo

Download Link: Download The Source Code

Official Website: https://github.com/mattrothenberg/use-gauge

License: MIT

Credit: Source link

Previous Next
Close
Test Caption
Test Description goes like this