import React, { useState, useCallback, useEffect } from 'react'; import ReactDOM from 'react-dom'; import { select, axisLeft, axisBottom, csv, arc, pie, scaleBand, scaleLinear, max, format} from 'd3'; const csvUrl ='https://gist.githubusercontent.com/Naimisha-M/04b48ed4deb00c159e3420f02a8e63d1/raw/744b58f3f62ee760eb8896085b6eb587f2052c6c/Sample500.csv' const height = 450; const margin = { top: 12, right: 20, bottom: 35, left: 150 }; const App = () => { const [data, setData] = useState(null); useEffect(() => { const row = d => { d.matches = +d['2021']; return d; }; csv(csvUrl, row).then(data => { setData(data.slice(0, 11)); }); }, []); if (!data) { return

Loading...

; } const innerHeight = height - margin.top - margin.bottom - 100; const innerWidth = width - margin.left - margin.right; const yScale = scaleBand() .domain(data.map(d => d.Leave)) .range([0, innerHeight]); const xScale = scaleLinear() .domain([0, max(data, d => d.Serial_Number)]) .range([0, innerWidth]); return ( ); }; const rootElement = document.getElementById('root'); ReactDOM.render(, rootElement);

Fork of company list

SaiSree0122