首页 > 解决方案 > 反应添加到图表

问题描述

大家好,我是 React 的新手。我正在尝试在图表中添加一条线,其中包含每个元素的总数

在此处输入图像描述

左边的图表包含存储在 item.data 内的变量 water_footprint 中的值

useEffect(
        () => {
            if (isLoading) {
                getData().then(
                    data => {
                        getMyItems(1).then(
                            items => {
                                getSeasons().then(
                                    seasons => {
                                        getProcess ().then (
                                            process => {
                                                setSeasons (seasons);
                                                setProcess (process)
                                                setItems (items);
                                                setData (data);
                                                
                                                setIsLoading (false);
                                                
                                                let wfp ={
                                                    id: "",
                                                    name: "",
                                                    data: []
                                                }

                                                /** @var filterData Array */
                                                const filterData = []
                                                process.forEach ((process_item, key) => {
                                                    
                                                    let item = {
                                                        id: process_item.id,
                                                        name: process_item.name,
                                                        data: []
                                                    }
                                                    
                                                    
                                                    seasons.forEach ((season, season_key) => {
                                                        const wf = parseInt (Math.random () * 30)
                                                        item.data.push ({
                                                            id: season.id,
                                                            season_name: season.name,
                                                            total: parseInt (Math.random () * 30),
                                                            water_footprint: wf,
                                                            carbon_footprint: parseInt (Math.random () * 30),
                                                            start_date: new Date(parseInt(season.name) + key, 6,14),
                                                            end_date: new Date(parseInt(season.name) + key, 6,30),
                                                            commentary:"Comment"
                                                        })
                                                        

                                                        if (! wfp[season.id]){
                                                            wfp.data.push ({
                                                                water_footprint: wf
                                                            })
                                                        } else{
                                                            wfp[season.id].wf +=wf
                                                        }
                                                    })
                                                    
                                                    filterData.push (item)
                                                    

                                                })
                                                filterData.push(wfp)


                                                setChartData (filterData);
                                                setWaterFootprintEvolution (filterData);
                                                
                                            }
                                        );
                                    }
                                );
                            },

                            error => {
                                setIsLoading (false);
                            }
                        );
                    }
                )
            }
        }, [isLoading]
    );
    

我试图通过创建一个总计变量、遍历过程元素和季节元素来做到这一点,并且对于每个季节,如果已经有一个总计值,则对下一个求和。如果没有值,则将值存储在总计中。

他们将此变量推送到过滤数据中。

我得到这个: 在此处输入图像描述

它不仅不添加值,而且应该具有三个参数的经度(3 个季节)

任何帮助都是极好的。太感谢了!

标签: reactjsgraph

解决方案


推荐阅读