js實現iview表格 排名列

 (有誤,請勿觀看)javascript

1、排名的簡單實現java


//排名例子1ajax

//須要排名的數組
//var myArray = [5,7, 7, 9, 8, 6, 23];json

//新數組
//var thisArray = [];數組

//將須要排名的數組中元素存入新數組,同時存入原始索引和新索引默認爲0
//for (var i = 1; i <= myArray.length; i++) {瀏覽器


// thisArray.push({ myValue: myArray[i - 1], oldIndex: i ,newIndex:0});
//}服務器

//將新數組按照值的大小排序
//thisArray.sort(function (a, b) {
// return b.myValue - a.myValue;
//});post

//將排序後順序存入新索引
//for (var i = 1; i <=thisArray.length; i++) {
// thisArray[i - 1].newIndex = i;
//}性能

//再根據原始索引排序
//thisArray.sort(function (a, b) {
// return a.oldIndex - b.oldIndex;
//});this

//此時獲取到的就是排序後的值了,而newIndex就是排名。

//console.log(thisArray);

//若是想單獨獲取排名能夠遍歷thisArray.newIndex 存入另外一個新的數組

 

//排名例子2
//var e2 = 20;
//var e3 = 10;
//var e4 = 70;
//var e5 = 20;
//var e6 = 50;
//var arrArray = [];
//for (var i = 2; i <= 6; i++) {
// arrArray.push({ e: window["e" + i], p: i });
//} 
//arrArray.sort(function (a, b) {
// return b.e - a.e;
//});
//for (var i = 0; i < arrArray.length; i++) {
// window["p" + arrArray[i].p] = i + 1;
//}
//console.dir(arrArray);
//console.log(p2);
//console.log(p3);
//console.log(p4);
//console.log(p5);
//console.log(p6);

 

2、實際數據及效果

 

三  項目中實現排名列的方法

    //缺點:循環過多且嵌套循環,往後數據量大幅增長時可能致使瀏覽器卡慢。
    //優勢:服務器端消耗性能很低。
    //改進思路:如何減小循環次數
    function myTableSort(data, yearList, regionNameList, myParam) {

        var mydata = data.concat();
        for (var j = 0; j < yearList.length; j++) {
            /****************取值********************/
            //參數數據
            var paramData = [];
            //根據年份、參數獲取某年某月參數數據
            for (var i = 0; i < mydata.length; i++) {
                if (mydata[i].Year == yearList[j]) {
                    //這裏能夠存入對象類型存入 參數數據、 Year和RegionName,後二者做爲排序後賦值時的判斷條件
                    paramData.push({ myValue: mydata[i][myParam], RegionName: mydata[i].RegionName, Year: mydata[i].Year });
                }
            }
            /**************** 處理********************/
            //對某年排名後數據
            var thisArray = [];
            //存入值和原始索引,新索引默認爲0
            for (var i = 1; i <= paramData.length; i++) {

                thisArray.push({ myValue: paramData[i - 1].myValue, RegionName: paramData[i - 1].RegionName, Year: paramData[i - 1].Year, oldIndex: i, newIndex: 0 });
            }
            //根據值排序,
            thisArray.sort(function (a, b) {
                return b.myValue - a.myValue;
            });
            //存入排序後的新索引
            for (var i = 1; i <= thisArray.length; i++) {
                thisArray[i - 1].newIndex = i;
            }
            //根據原始索引對數組排序
            thisArray.sort(function (a, b) {
                return a.oldIndex - b.oldIndex;
            });
            //此時新索引就是排名
            //console.log(thisArray);
            /**************** 賦值 ********************/
            //將當年排名後數據 賦值到mydata
            for (var i = 0; i < mydata.length; i++) {
                //若是年份相等
                if (mydata[i].Year == yearList[j]) {
                    //城市名稱循環賦值單行
                    for (var k = 0; k < regionNameList.length; k++) {
                        //若是參數值相等則賦值排名
                        if (mydata[i].RegionName == thisArray[k].RegionName && mydata[i].Year == thisArray[k].Year && mydata[i][myParam] == thisArray[k].myValue) {
                            mydata[i].IndexRank = thisArray[k].newIndex;
                            //  console.log("綜合指數:" + mydata[i][myParam], "排名:" + thisArray[k].newIndex);
                        }
                    }
                }
            }

        }

        return mydata;
    }

  

4、數據獲取和前期處理:

    function loadChart() {

        $.ajax({
            url: '@Url.Action("BasicEvaluationData")',
            data: {},
            type: "post",
            dataType: "json",
            success: function (result) {
                if (result != undefined && result != null && result.success == true) {
                    var paramsList = ["UrbanEcologicalIndex", "EcologicalAssetIndex", "EcologicalLandscapeIndex", "EcologicalPressureIndex", "EcologicalConstructionIndex", "EcologicalServiceIndex"];
                    var regionNameList = [];
                    var data = [];
                    var yearList = [];
                    for (var i = 0; i < result.rows.length; i++) {
                        var row = result.rows[i];
                        var rowObj = new Object();
                        for (var j in row) {
                            rowObj[j] = row[j];
                        }
                        regionNameList.push(rowObj.RegionName);
                        yearList.push(rowObj.Year);
                        data.push(rowObj);
                    }
                    yearList = Distinct(yearList);
                    regionNameList = Distinct(regionNameList);
                    //console.dir(regionNameList);
                    //console.dir(yearList);

                    myTable(yearList, regionNameList, data, paramsList);
                    myEcharts(yearList, regionNameList, data, paramsList);


                }
            }
        });

    }
相關文章
相關標籤/搜索