JSON data not showing up in console log

Question

I'm trying to get JSON data to show up in the console log but for some reason it's not working. How do I store the JSON data in a variable and print to console?

    const [lat, setLat] = useState([]);
    const [long, setLong] = useState([]);
    const [data, setData] = useState([]);
    
    useEffect(() => {
        const fetchData = async () => {
            navigator.geolocation.getCurrentPosition(function(position) {
                setLat(position.coords.latitude);
                setLong(position.coords.longitude);
            });
        
            console.log("Latitude is:", lat)
            console.log("Longitude is:", long)
        
        await fetch(`${process.env.REACT_APP_API_URL}?location=${lat},${long}&timesteps=1d&units=imperial&apikey=${process.env.REACT_APP_API_KEY}&fields=treeIndex,weedIndex,grassIndex`)
         .then(res => res.json())
         .then(res => {
            setData(res);
            console.log(res);
        }); 
        }
    fetchData();
    
    }, [lat, long]);