在Chartjs中使用JavaScript在IEnumerable中迭代

我遇到了一個問題，其中我有一個IEnumerable<string>標籤和一個IEnumerable<double[]>數據在我的MVC模型對象中，我想用Chartjs繪製這些值。在Chartjs中使用JavaScript在IEnumerable中迭代

我將兩者都傳遞給我的javascript函數，我試圖繪製圖表。

的Chartjs語法是這樣的，我想，在效果：

var data = { 
       ... chart info e.g. colors, etc. 
       datasets: [ 
        { 
         label: labels[0], // My first label 
         data: datas[0] // My first double[] 
        }, 
        // Repeat for each data/label combo 
        { 
         label: labels[n], // My n-th label 
         data: datas[n] // My n-th double[] 
        } 
       ] 
      };

由於我的兩個集合，我怎麼能適當地提取在其中的信息？很明顯，這些集合的長度必須相同，因爲存在一對一關聯。我曾嘗試將它們梳理成一個Tuple，但我認爲這會讓它在js方面變得更加複雜。

還是有人知道一個更簡單的方法來實現與ChartJS相同的最終結果？

我很喜歡C＃，但Javascript對我而言是新的。

來源

2016-05-13 B_D

可以隨時[zip]（https://msdn.microsoft.com/en-us/library/dd267698（v = vs.100）.aspx）這兩個集合，然後使用[JavaScriptSerializer]（https：/ /msdn.microsoft.com/en-us/library/system.web.script.serialization.javascriptserializer(v=vs.110).aspx）。 – apokryfos

您當然可以將元組發送到客戶端，並使用java-script輕鬆分割它。你可以做一個簡單的ajax調用來將你的元組作爲一個Json對象，然後將它分成兩個數組。這些數組可以用於chart.js標籤和數據點。

$.ajax({ 
    url: 'AjaxCall/getChartObjects', 
    dataType: 'json', 
    data: {}, 
    success: function (data) { //data here being the tuple recieved from server 
     //receive the tuple as a single Json object and split it up easily with some seperate arrays 
     dblArray= [] 
     $.each(data.Item1, function (index, value) { 
      dblArray.push(value.text); //label array 
     } 
     descArray= [] 
     $.each(data.Item2, function (index, value) { 
      descArray.push(value.dblTxt); //data array 
     } 
    }, 
    error: function (xhr, status, error) { 
     console.log('Error: ' + error.message); 
    } 
});

從控制器發送元組會是這樣的：

//tuple sends two objects together- both job arrays will be seperated 
//and used in observables on client side 
var chartObjects = Tuple.Create(chartData, chartLabel); 

return Json(chartObjects, JsonRequestBehavior.AllowGet);

你會再有，你需要在圖表屬性放置陣列：

var barChartData = { 
       labels: descArray, //array labels 
       datasets: [ 
        { 
         type: "Bar", 
         strokeColor: "black", 
         pointColor: "rgba(220,220,220,1)", 
         pointstrokeColor: "white", 
         data: dblArray, 

        } 
       ] 
      }

我猜我不完全確定這是否是你想要的。如果您有任何問題，請告訴我。

來源

2016-05-13 20:28:10 MUlferts

感謝您的建議。我想也可以傳入多個元組，使得我在'var barChartData'的'datasets'設置中有許多'{...}'。你知道我將如何遍歷JS中的元組枚舉嗎？ –

如果你通過列表，枚舉，數組或其他任何東西，JavaScript不關心。您傳遞給客戶端作爲Json對象的對象將在javascript中處理。我想我不完全明白你在問什麼。你可以使用for循環在JS中循環對象，或者像上面用jquery $ .each循環做的那樣。 – MUlferts

在Chartjs中使用JavaScript在IEnumerable中迭代

回答

相關問題