大二下学期第一次结对作业(第二阶段)

今日实现了世界地图的图表联动,跟实现中国地图的图表联动一样,需要将中英文做对应的转换:

        var btn = document.getElementById("query2");
        btn.onclick = function() {
            var fromyear = document.getElementById("fromyear").value;
            var fromday = document.getElementById("fromday").value;
            var frommounth = document.getElementById("frommounth").value;
            var toyear = document.getElementById("toyear").value;
            var today = document.getElementById("today").value;
            var tomounth = document.getElementById("tomounth").value;
            var continent = document.getElementById("continent").value;
            var country = document.getElementById("country").value;
            var province = document.getElementById("province").value;
            var city = document.getElementById("city").value;
            $.ajax({
                url: "/query2",
                data: {
                    fromyear: fromyear, fromday: fromday, frommounth: frommounth,
                    toyear: toyear, today: today, tomounth: tomounth,
                    continent: continent, country: country, province: province, city: city
                },
                success: function (data) {
                    if (province != "" || city != "" || country == "中国") {
                        if (city != "" || province != "") {
                            appendHtmlHead = "<tr><th>日期</th>" +
                                "<th>省份</th>" +
                                "<th>市区</th>" +
                                "<th>累计确诊</th>" +
                                "<th>累计治愈</th>" +
                                "<th>累计死亡</th>" +
                                "<th>现有确诊</th><tr>"
                            $(".map-table thead").empty();
                            $(".map-table thead").append(appendHtmlHead);
                            $(".map-table tbody").empty();
                            for (var i = 0; i < data.data.length; i++) {
                                var Day = data.data[i][0].split(' ')
                                appendHtmlBody = "<tr><td>" +
                                    Day[3] + Day[2] + Day[1] + "</td><td>" +
                                    data.data[i][1] + "</td><td>" +
                                    data.data[i][2] + "</td><td>" +
                                    data.data[i][3] + "</td><td>" +
                                    data.data[i][4] + "</td><td>" +
                                    data.data[i][5] + "</td><td>" +
                                    (data.data[i][3] - data.data[i][4] - data.data[i][5]) + "</td><tr>"
                                $(".map-table tbody").append(appendHtmlBody);
                            }
                        }
                        if (country == "中国" && province == "" && city == "") {
                            appendHtmlHead = "<tr><th>日期</th>" +
                                "<th>省份</th>" +
                                "<th>累计确诊</th>" +
                                "<th>累计治愈</th>" +
                                "<th>累计死亡</th>" +
                                "<th>现有确诊</th></tr>"
                            $(".map-table thead").empty();
                            $(".map-table thead").append(appendHtmlHead);
                            $(".map-table tbody").empty();
                            for (var i = 0; i < data.data.length; i++) {
                                var Day = data.data[i][0].split(' ')
                                appendHtmlBody = "<tr><td>" +
                                    Day[3] + Day[2] + Day[1] + "</td><td>" +
                                    data.data[i][1] + "</td><td>" +
                                    data.data[i][2] + "</td><td>" +
                                    data.data[i][3] + "</td><td>" +
                                    data.data[i][4] + "</td><td>" +
                                    (data.data[i][2] - data.data[i][3] - data.data[i][4]) + "</td></tr>"
                                $(".map-table tbody").append(appendHtmlBody);
                            }
                        }
                    }
                    if (province == "" && city == "" && country != "中国") {
                        appendHtmlHead = "<tr><th>日期</th>" +
                            "<th>国家</th>" +
                            "<th>累计确诊</th>" +
                            "<th>累计治愈</th>" +
                            "<th>累计死亡</th>" +
                            "<th>现有确诊</th></tr>"
                        $(".map-table thead").empty();
                        $(".map-table thead").append(appendHtmlHead);
                        $(".map-table tbody").empty();
                        for (var i = 0; i < data.data.length; i++) {
                            var Day = data.data[i][0].split(' ')
                            appendHtmlBody = "<tr><td>" +
                                Day[3] + Day[2] + Day[1] + "</td><td>" +
                                data.data[i][1] + "</td><td>" +
                                data.data[i][2] + "</td><td>" +
                                data.data[i][3] + "</td><td>" +
                                data.data[i][4] + "</td><td>" +
                                data.data[i][5] + "</td></tr>"
                            $(".map-table tbody").append(appendHtmlBody);
                        }
                    }
                    if (data.data == "") {
                        alert("暂无数据")
                    }
                    $(".map-table tbody").find('tr').on('mouseenter',function(){
                        var hang = $(this).prevAll().length;
                        if(province != "" || city != "" || country == "中国"){
                            myChart.dispatchAction({ type: 'highlight', name:add_name(data.data[hang][1])});
                        }
                        if(province == "" && city == "" && country != "中国"){
                            myChart.dispatchAction({ type: 'highlight', name:trans_world(data.data[hang][1])});
                        }
                        //选中高亮
                    })
                    // 鼠标移出的第几行数据
                     $(".map-table tbody").find('tr').on('mouseleave',function(){
                         var hang = $(this).prevAll().length;
                         if(province != "" || city != "" || country == "中国"){
                             myChart.dispatchAction({ type: 'downplay', name:add_name(data.data[hang][1])});
                         }
                          if(province == "" && city == "" && country != "中国"){
                            myChart.dispatchAction({ type: 'downplay', name:trans_world(data.data[hang][1])});
                        }
                         //取消高亮
                     })
                     myChart.on('mouseOver', function(params){
                         console.log(params);//此处写点击事件内容
                         if(province != "" || city != "" || country == "中国") {
                             for(var i=0;i<data.data.length;i++){
                             // data11[i].value="0";
                                 if(del_name(params.name) == data.data[i][1]){
                                     console.log(params.name);
                                     //addressList[i].value="1";
                                     // 选中高亮
                                     myChart.dispatchAction({ type: 'highlight', name:params.name});
                                     $(".map-table tbody tr").eq(i).addClass('highTr');
                                 }
                             }
                         }
                         if(province == "" && city == "" && country != "中国") {
                             for(var i=0;i<data.data.length;i++){
                             // data11[i].value="0";
                                 if(del_world(params.name) == data.data[i][1]){
                                     console.log(params.name);
                                     //addressList[i].value="1";
                                     // 选中高亮
                                     myChart.dispatchAction({ type: 'highlight', name:params.name});
                                     $(".map-table tbody tr").eq(i).addClass('highTr');
                                 }
                             }
                         }
                     });
                    //  移出该区域时,取消高亮
                    myChart.on('mouseOut', function(params){
                        console.log(params);//此处写点击事件内容
                        if(province != "" || city != "" || country == "中国") {
                            for(var i=0;i<data.data.length;i++){
                            // data11[i].value="0";
                                if(del_name(params.name) == data.data[i][1]){
                                    console.log(params.name);
                                    //取消高亮
                                    myChart.dispatchAction({ type: 'downplay', name:params.name});
                                    $(".map-table tbody tr").eq(i).removeClass('highTr');
                                }
                            }
                        }
                        if(province == "" && city == "" && country != "中国") {
                             for(var i=0;i<data.data.length;i++){
                             // data11[i].value="0";
                                 if(del_world(params.name) == data.data[i][1]){
                                     console.log(params.name);
                                     //addressList[i].value="1";
                                     // 选中高亮
                                     myChart.dispatchAction({ type: 'downplay', name:params.name});
                                     $(".map-table tbody tr").eq(i).removeClass('highTr');
                                 }
                             }
                         }
                    });
                },
                error: function (xhr, type, errorThrown) {
                }
            })
        }

原文地址:https://www.cnblogs.com/fengchuiguobanxia/p/14616130.html