使用Chart.Js的可变范围问题

时间:2018-03-29 09:39:47

标签: javascript chart.js

我正在使用Chart.js在我的应用程序中呈现多个图表。 在每个图表中,我使用具有不同用户的下拉按钮,并在选择时更新图表。每个图表都有解释:

model_content = {
      0:["fpeofko"+ fName + "fdpfokvf", "fpeofko"+ fName + "fdpfokvf" ],
      1:["fpeofko"+ fName + "fdpfokvf","fpeofko"+ fName + "fdpfokvf"],
      2:["fpeofko"+ fName + "fdpfokvf","fpeofko"+ fName + "fdpfokvf"],
      3:["fpeofko"+ fName + "fdpfokvf","fpeofko"+ fName + "fdpfokvf"]
}

$(".pick-chart").change(function(e) {
        e.preventDefault();
        var val = $(this).val();
        if (val != 0) {
                    info_process.data.datasets[1].data = info_array[val];
                    info_process.update();
                    var name2 = $('option[value='+val+']').text();
                    var fName = name2.split(' ')[0];
                    $("#ops-info").empty()
                    $("#dif-info").empty()
                    $("#info-head").empty()
                    ops = opposed_model[val]
                    dif = differ_model[val]

                    $("#info-head").append(" with "+ fName);

                    for(var x = 0; x < ops.length; x++){

                      text_content = model_content[ops[x]]
                      if (ops[x] <= 5){
                          if (complete[ops[x]] > 0){
                              inner_text_content = text_content[0];
                            } else {
                              inner_text_content = text_content[1];
                            }
                        $("#ops-info").append(
                        "<div class='collapsediv' data-toggle='collapse' href='#collapseExample" + ops[x] + "' + 'role=button' aria-expanded='false' aria-controls='collapseExample'>"
                        + complete_label[ops[x]] + "<img src='{% static 'images/expand.png' %}' class='float-right'>" + "</div>"+
                        "<div class='collapse' id='collapseExample" + ops[x]+ "'"  + "'><div class='card card-body'>"+ inner_text_content +"</div></div>"
                              );
                            }
                          }
                    for(var x = 0; x < dif.length; x++){
                      text_content = model_content[ops[x]]
                      if (dif[x] <= 5){
                        if (complete[ops[x]] > 0){
                          inner_text_content = text_content[0];
                        } else {
                          inner_text_content = text_content[1];
                        }
                        $("#dif-info").append(
                          "<div class='collapsediv' data-toggle='collapse' href='#collapseExample" + dif[x] + "' + 'role=button' aria-expanded='false' aria-controls='collapseExample'>"
                          + complete_label[dif[x]] + "<img src='{% static 'images/expand.png' %}' class='float-right'>" + "</div>"+
                          "<div class='collapse' id='collapseExample" + dif[x]+ "'"  + "'><div class='card card-body'>"+ inner_text_content +"</div></div>"
                        );
                        }
                    }
                } else {
            info_process.data.datasets[1].data = [];
            $("#info-head").empty()
            if (document.getElementById("ops-info") !== null){
              document.getElementById("ops-info").innerHTML = "";
            }
            if (document.getElementById("dif-info") !== null){
              document.getElementById("dif-info").innerHTML = "";
            }

        }
        info_process.update();
    });

我希望能够在我的model_content中显示所选用户的名称,该名称存储在fName中。事情是因为它超出了我的功能,它超出了范围。

我可以将model_content放在函数中,但我有很多图表,所以这意味着很多次复制/粘贴model_content ..

编辑:

function modelContent(fName){
   model_content = {
      0:["fpeofko"+ fName + "fdpfokvf", "fpeofko"+ fName + "fdpfokvf" ],
      1:["fpeofko"+ fName + "fdpfokvf","fpeofko"+ fName + "fdpfokvf"],
      2:["fpeofko"+ fName + "fdpfokvf","fpeofko"+ fName + "fdpfokvf"],
      3:["fpeofko"+ fName + "fdpfokvf","fpeofko"+ fName + "fdpfokvf"]
    } 
    return model_content
}

0 个答案:

没有答案