c#到javascript结合/合并datetime和int null数组默认

时间:2016-07-17 14:53:26

标签: javascript c# asp.net-mvc datetime dictionary

我一直在网上搜索,找不到任何具体到我正在寻找的内容,所以我创建了一个新问题。

我正在研究MVC5。我需要为图表填充谷歌图表数据表。

我在其中一个视图的模型中有3个测试类列表存储在c#字典中:

public class ThisClassIsTheViewModel
{
    //Some Properties here
    //...
    public Dictionary<string, List<Test>> TestHistory { get; set; }
    //I have the constructors here
    //...
}    

public class Test
{   //Some Properties here
    //...
    public System.DateTime DateOfTest { get; set; }

    private int _timeTaken;
    public float TimeTaken
    {
        get { return _timeTaken / 1000f; }
        set { _timeTaken = (int)value; }
    }
    //I have the constructors here
    //...
}

TestHistory中的字符串键表示测试类型。总共有3种测试类型,这就是为什么我提到上面3个测试类列表的原因,但这个数字可能会改变。

我设法填充数据表,其中1)测试的第一个列表中的日期2)和2.1)的第一,2.2)秒和2.3)第三系列测试的TimeTaken属性,创建一个包含3行的图形(每个测试一个。)

this is the graph i managed to create

这很好,因为在大多数情况下,三种类型的测试会在几秒钟内一个接一个地运行,并且DateofTest属性会从秒信息中删除。但我想让这更好。

这是我目前用来填充图表的Javascript:

// Create the data table.
var data = new google.visualization.DataTable();

//Get testTypes from model
var testTypeNames = @Html.Raw(Json.Encode(Model.TestHistory));

//Add a column for the x-axis
data.addColumn('datetime', 'Time of Day');
//Start a counter for the number of columns
var colNum = 1;
//Add a column for each test type (will be considered as a different line)
for (var testTypeName in testTypeNames) {
    data.addColumn('number', testTypeName.toString())
    colNum++
}

//Initialise datetime range
var minDate = new Date(2070, 1, 1);
var maxDate = new Date(1970, 1, 1);
//Initialize container for data to be passed to google datatable
var datetimeList = new Array();
var date, timeTaken;

//Get data from model to container created above (datetimeList)
@foreach (var item in Model.TestHistory[Model.TestHistory.Keys.ElementAt(0)])
{
    <text>
        //First testType
        //Get date from model
        var dateSplit = '@item.DateOfTest.ToString().Split(' ')[0]';
        var timeSplit = '@item.DateOfTest.ToString().Split(' ')[1]';
        date = new Date()
        date.setFullYear(dateSplit.split('/')[2]);
        date.setMonth(dateSplit.split('/')[1]-1);
        date.setDate(dateSplit.split('/')[0]);
        date.setHours(timeSplit.split(':')[0])
        date.setMinutes(timeSplit.split(':')[1])
        date.setSeconds(timeSplit.split(':')[2])
        //Update min/max date for graph
        if (minDate > date)
            minDate = date
        if (maxDate < date)
            maxDate = date
        //Set timetaken
        timeTaken = parseInt(@item.TimeTaken)
        //Push data to array
        datetimeList.push([date, timeTaken])
    </text>
}
@for (int i=1; i < @Model.TestHistory.Keys.Count; i++)
{
    foreach (var item in Model.TestHistory[Model.TestHistory.Keys.ElementAt(i)].Select((value, index) => new { index, value }))
    {
        <text>
            //Other testType
            //Get date from model
            var dateSplit = '@item.value.DateOfTest.ToString().Split(' ')[0]';
            var timeSplit = '@item.value.DateOfTest.ToString().Split(' ')[1]';
            var date = new Date()
            date.setFullYear(dateSplit.split('/')[2]);
            date.setMonth(dateSplit.split('/')[1]-1);
            date.setDate(dateSplit.split('/')[0]);
            date.setHours(timeSplit.split(':')[0])
            date.setMinutes(timeSplit.split(':')[1])
            date.setSeconds(timeSplit.split(':')[2])
            //Update min/max date for graph
            if (minDate > date)
                minDate = date
            if (maxDate < date)
                maxDate = date
            //Set timetaken
            var timeTaken = parseInt(@item.value.TimeTaken);
            datetimeList[@item.index].push(timeTaken);
        </text>
    }
}

//Pass data from container (datetimeList) to google datatable
datetimeList.forEach
(
    function myFunction(value)
    {
        //Initialize datarow with empty values and correct size (colNum)
        var datarow = new Array(colNum);
        for (var i=0; i < datarow.length; i++) 
        {
            datarow[i] = null;
            datarow[i] = value[i];
        }
        data.addRows( [datarow] );
    }
)

理想情况下,我想创建3个(这可能会改变)javascript数组(DateofTest,TimeTaken)并使用空值组合它们,其中没有任何内容可以插入(意味着一个系列可能具有6.30pm的值,例如,但另一个系列不会)。我已经做了类似的事情,将列表与不同数量的测试结合起来,如下面的脚本所示。

我基本上需要一个带有三个clases列表的代码的想法,从每个列表的每个类中提取两个属性的值,并创建一个新的数组,当我无法插入值时,使用null组合每个列表的结果

这三个数组看起来像这样:

[
    [DateofTest1, Timetaken1, null, null],
    [DateofTest1, Timetaken1, null, null],
    [...],
    [DateofTest1, Timetaken1, null, null],
]

[
    [DateofTest2, null, Timetaken2, null],
    [DateofTest2, null, Timetaken2, null],
    [...],
    [DateofTest2, null, Timetaken2, null],
]

[
    [DateofTest3, null, null, Timetaken3],
    [DateofTest3, null, null, Timetaken3],
    [...],
    [DateofTest2, null, null, Timetaken3],
]

我需要构建的数组看起来或多或少是这样的:

[
    [DateofTest1, Timetaken1, null, null],
    [DateofTest2, null, Timetaken2, null],
    [DateofTest3, null, null, Timetaken3],

    [DateofTest1, Timetaken1, Timetaken2, null],
    [DateofTest2, null, Timetaken2, Timetaken3],
    [DateofTest3, Timetaken1, null, Timetaken3],

    [...],

    [DateofTest1, Timetaken1, Timetaken2, Timetaken3],
    [DateofTest2, Timetaken1, Timetaken2, Timetaken3],
    [DateofTest3, Timetaken1, Timetaken2, Timetaken3],
]

关于如何实现这一目标的任何建议?

0 个答案:

没有答案