Plotly數據環

在C＃代碼隱藏我定義一些清單是這樣的：Plotly數據環

public List<string> divs = new List<string>(); 
public List<List<string>> names = new List<List<string>>(); 
public List<List<List<string>>> labels = new List<List<List<string>>>(); 
public List<List<List<double>>> longitude = new List<List<List<double>>>();

相當大名單我知道，但我覺得有必要對正從正常組織我的源我的所有信息。

在JS

我這些序列是這樣的：

var divArr = <%=new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(divs)%>; 
var names = <%=new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(names)%>; 
var lbl = <%=new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(labels)%>; 
var long = <%=new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(longitude)%>;

然後我嘗試做一個函數來繪製所有這些單獨圖形。我的頁面上總共有10個圖表，它們可以有多行。試圖使我的頁面儘可能動態。所以我有一個函數來循環所有這些，並嘗試繪製所有這些。

function doGraph(){ 
    for(index = 0; index < divArr.length; ++index){ 
     (function() { 

      var data = []; 
      for(indx = 0; indx < lbl[index].length; ++indx){ 
       var trace = { 
        name: names[index][indx], 
        x: lbl[index][indx], 
        y: long[index][indx], 
        mode:'lines' 
       }; 
       data.push(trace); 
      } 

      var gd = document.getElementById(divArr[index]); 
      plotly.newPlot(gd,data); 

       })(); 
      } 
}

它幾乎可以工作。每張圖似乎都繪製了給予它的第一組數據，但沒有任何後續字。也許我一直在盯着這個太久，但我不明白我在這裏做錯了什麼，但我確信這是我剛纔看過的東西。或者，也許我過度了，我不能做這種事情？任何見解都被讚賞！

來源

2016-12-13 Guernica88

你的javascript代碼混淆了我，看起來像錯誤的支架使用。此外，我不明白使用內部函數'（function（）{'在第3行 - 但我不是一個JavaScript專業版。此外，我認爲你需要一個大的P''Plotly.newPlot（gd，data）' – flipperweid

@flipperweid你是正確的Plotly被大寫。錯過了。我不是JavaScript的專業版，但我想要做的循環是做一個跟蹤數據數組。var數組是一個數組，每個var跟蹤雖然我找不到像Plotly這樣的具體例子，所以我不確定我是否正確地做到了這一點 – Guernica88

@flipperweid我想通了，並在下面添加了我的答案真正的問題是我的瘋狂列表和它們的序列化。感謝您的輸入，儘管我清理了我的代碼。 – Guernica88

所以我發現問題是從我的列表到js數組的序列化。顯然，js serialize不能很好地處理我瘋狂使用的多維列表的級別。所以我固定它通過使列出一個水平不太深並提出另一個列表來跟蹤它們是如何「深」是用這種方式：

C＃代碼隱藏：

public List<List<string>> names = new List<List<string>>(); 
public List<int> numObjs = new List<int>(); 
public List<List<string>> labels = new List<List<string>>(); 
public List<List<double>> longitude = new List<List<double>>();

JS連載：

var divArr = <%=new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(divs)%>; 
var names = <%=new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(names)%>; 
var numO = <%=new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(numObjs)%>; 
var lbl = <%=new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(labels)%>; 
var long = <%=new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(longitude)%>;

那麼JS功能有這樣一個循環的實際變化：

function doGraph(){ 
     var cur = 0; 
     for(var index = 0; index < divArr.length; ++index){ 
       var data = []; 
       var top = cur + numO[index]; 
       for(var indx = cur; indx < top; ++indx){ 
        data.push({ 
         name: names[indx], 
         mode:'lines', 
         x: lbl[indx], 
         y: long[indx], 
        }); 
        cur++; 
       } 

       var gd = document.getElementById(divArr[index]); 
       Plotly.newPlot(gd, data, 
           layout , {scrollZoom:true,modeBarButtonsToRemove:['sendDataToCloud'],showLink:false,displaylogo:false}); 
     } 
}

而且@ flipperweid說，我在一個函數中的函數肯定是不必要的。

來源

2016-12-14 16:52:54 Guernica88

回答

相關問題