How to set path to full width and height of svg?

Question

React

How to make it right so that the path in svg is the entire length and width of the svg (svg has a width and height of 100%), because I have it adaptive, as well as how to correctly flip the graph

const Chart = (props) => {

    const [data, setData] = useState([86, 32, 86, 32, 10, 84, 38, 80, 2, 100])
    const svgRef = useRef()

    useEffect(() => {
        const svg = select(svgRef.current)
        const myLine = line()
            .x((value, index) => index)
            .y(value => value)
            .curve(curveCardinal)

        svg
            .selectAll('path')
            .data([data])
            .join('path')
            .attr('d', value => myLine(value))
            .attr('fill', 'none')
            .attr('stroke', 'lavender')
            .attr('stroke-width', '2px')
    }, [data])

    return (
        <div className={s.elem}>
            <svg ref={svgRef}></svg>
        </div>
    )
}

Answer 1

I did not see the viewbox - write it exactly according to the size of the svg