import { useState, useEffect, useRef } from 'react'
import useEcharts from '../../../../../hooks/useEcharts';
import CdzyApi from '../../../../../../utils/apis/CdzyApi';
import { getOption } from './echartsOptions';
import LittleTitle from '../../../../../common/LittleTitle';
import HomeApi from '../../../../../../utils/apis/HomeApi';
import CdzzyApi from '../../../../../../utils/apis/CdzzyApi';

export default function Ztmjtj(props) {
    const [data, setData] = useState();
    const ref = useRef();
    const chart = useEcharts(ref.current);
    useEffect(() => {

        CdzzyApi.acreageCount().then(resp => {
            setData(resp.data);
        })
    }, []);
    useEffect(() => {
        if (chart && data) {
            const options = getOption(data);
            chart.setOption(options);
        }
    }, [chart, data]);
    return <>
        <LittleTitle>占用面积统计</LittleTitle>
        <div ref={ref} className="fill h0" style={{
        }}></div>
    </>
}