在图表中绘制动态数据

时间:2016-08-18 12:33:24

标签: javascript arrays json

我尝试使用下面的代码在图表中绘制动态数据,但我得到相同的数据。因为最后一个数据粉碎了第一个数据(一个在另一个数据上)。

<script type="text/javascript">

                            var unities = <%-JSON.stringify(unities) %>;
                            var data = <%-JSON.stringify(data) %>;

                            var dataTracer = {};
                            var arrayDate = [];
                            var arrayData = [];
                            var arrayDataTracer = [];
                            unities.forEach(function(docUnity){

                                data.forEach(function(docData) {
                                    if(docUnity.unity == "date"){
                                         arrayDate.push(docData[docUnity._id]);
                                    }});
                            });                            
                            unities.forEach(function(docUnity){
                                if(docUnity.unity != "date" && docUnity.type_cumul == "simple" && docUnity.archiver == 0) {

                                    dataTracer["x"] = arrayDate;
                                    dataTracer["name"] = docUnity.unity;
                                    dataTracer["type"] = 'scatter';

                                    data.forEach(function(docData) {
                                        arrayData.push(docData[docUnity._id]);
                                    });
                                    dataTracer["y"] = arrayData;
                                    alert(dataTracer);
                                    arrayDataTracer.push(dataTracer);
                                }
                            });

                            Plotly.newPlot('myDiv', arrayDataTracer);

                        </script>

结果是

enter image description here

当我期待结果时,我会创建更多这样的变量

<script type="text/javascript">

                            var unities = <%-JSON.stringify(unities) %>;
                            var data = <%-JSON.stringify(data) %>;

                            var dataTracer = {};
                            var dataTracer2 = {};
                            var arrayDate = [];
                            var arrayData = [];
                            var arrayData2 = [];
                            var arrayDataTracer = [];
                            unities.forEach(function(docUnity){

                                data.forEach(function(docData) {
                                    if(docUnity.unity == "date"){
                                        arrayDate.push(docData[docUnity._id]);
                                    }});
                            });

                            unities.forEach(function(docUnity){

                                if(docUnity.unity == "Objectif"){
                                    dataTracer2["x"] = arrayDate;
                                    dataTracer2["name"] = docUnity.unity;
                                    dataTracer2["type"] = 'scatter';

                                    data.forEach(function(docData) {
                                            arrayData2.push(docData[docUnity._id]);
                                        });
                                    dataTracer2["y"] = arrayData2;
                                    alert(dataTracer2);
                                    arrayDataTracer.push(dataTracer2);
                                }
                            });
                            unities.forEach(function(docUnity){
                                if(docUnity.unity == "Resultat"){
                                    dataTracer["x"] = arrayDate;
                                    dataTracer["name"] = docUnity.unity;
                                    dataTracer["type"] = 'scatter';

                                    data.forEach(function(docData) {
                                        arrayData.push(docData[docUnity._id]);
                                    });
                                    dataTracer["y"] = arrayData;
                                    alert(dataTracer);
                                    arrayDataTracer.push(dataTracer);
                                }
                            });

                            Plotly.newPlot('myDiv', arrayDataTracer);

                        </script>

我明白了 enter image description here

1 个答案:

答案 0 :(得分:0)

它应该通过添加这些行来启动变量

arrayData = [];
dataTracer = {};

所以代码将是

unities.forEach(function(docUnity){
                                if(docUnity.unity != "date" && docUnity.type_cumul == "simple" && docUnity.archiver == 0) {
                                //if(docUnity.unity == "Resultat"){
                                    dataTracer["x"] = arrayDate;
                                    data.forEach(function(docData) {
                                        arrayData.push(docData[docUnity._id]);
                                    });
                                    dataTracer["y"] = arrayData;
                                    arrayData = [];
                                    dataTracer["name"] = docUnity.unity;
                                    dataTracer["type"] = 'scatter';
                                    alert(dataTracer.y);
                                    arrayDataTracer.push(dataTracer);
                                    dataTracer = {};
                                }
                            });