console
var app = new Vue({
el: "#app",
data() {
return {
item: {
titleCh: "日AI通关陪练总人次",
titleEn: "Risk",
num: 0,
unit: "人次"
},
scaleLabel: [0, 15, 30, 45, 60, 75, 90],
totalHours: 0,
percentage: 0,
strokeWidth: "4.8",
color: "#2391f1",
bgColor: "#1c3c81",
count: 0,
countMove: 0,
newArr: [],
newArr1: [],
moveArr: [],
moveArr1: [],
timer: null,
dayStudyData: [{ "statis_date": "00:00:00", "5_min_study_num": 559, "day_study_num": 559, "day_study_time": "82.92" }, { "statis_date": "00:05:00", "5_min_study_num": 503, "day_study_num": 1062, "day_study_time": "157.59" }, { "statis_date": "00:10:00", "5_min_study_num": 460, "day_study_num": 1522, "day_study_time": "226.02" }, { "statis_date": "00:15:00", "5_min_study_num": 413, "day_study_num": 1936, "day_study_time": "287.42" }, { "statis_date": "00:20:00", "5_min_study_num": 401, "day_study_num": 2338, "day_study_time": "347.03" }, { "statis_date": "00:25:00", "5_min_study_num": 352, "day_study_num": 2690, "day_study_time": "399.33" }, { "statis_date": "00:30:00", "5_min_study_num": 307, "day_study_num": 2998, "day_study_time": "444.95" }, { "statis_date": "00:35:00", "5_min_study_num": 293, "day_study_num": 3291, "day_study_time": "488.49" }, { "statis_date": "00:40:00", "5_min_study_num": 288, "day_study_num": 3579, "day_study_time": "531.29" }, { "statis_date": "00:45:00", "5_min_study_num": 276, "day_study_num": 3856, "day_study_time": "572.48" }, { "statis_date": "00:50:00", "5_min_study_num": 263, "day_study_num": 4120, "day_study_time": "611.63" }, { "statis_date": "00:55:00", "5_min_study_num": 239, "day_study_num": 4359, "day_study_time": "647.25" }, { "statis_date": "01:00:00", "5_min_study_num": 230, "day_study_num": 4590, "day_study_time": "681.46" }, { "statis_date": "01:05:00", "5_min_study_num": 218, "day_study_num": 4808, "day_study_time": "713.94" }, { "statis_date": "01:10:00", "5_min_study_num": 200, "day_study_num": 5009, "day_study_time": "743.77" }, { "statis_date": "01:15:00", "5_min_study_num": 177, "day_study_num": 5186, "day_study_time": "770.17" }, { "statis_date": "01:20:00", "5_min_study_num": 174, "day_study_num": 5361, "day_study_time": "796.07" }, { "statis_date": "01:25:00", "5_min_study_num": 165, "day_study_num": 5526, "day_study_time": "820.68" }, { "statis_date": "01:30:00", "5_min_study_num": 156, "day_study_num": 5682, "day_study_time": "843.88" }, { "statis_date": "01:35:00", "5_min_study_num": 139, "day_study_num": 5821, "day_study_time": "864.62" }, { "statis_date": "01:40:00", "5_min_study_num": 133, "day_study_num": 5955, "day_study_time": "884.56" }, { "statis_date": "01:45:00", "5_min_study_num": 137, "day_study_num": 6093, "day_study_time": "905.06" }, { "statis_date": "01:50:00", "5_min_study_num": 130, "day_study_num": 6224, "day_study_time": "924.50" }, { "statis_date": "01:55:00", "5_min_study_num": 123, "day_study_num": 6348, "day_study_time": "942.87" }, { "statis_date": "02:00:00", "5_min_study_num": 118, "day_study_num": 6467, "day_study_time": "960.57" }, { "statis_date": "02:05:00", "5_min_study_num": 114, "day_study_num": 6581, "day_study_time": "977.59" }, { "statis_date": "02:10:00", "5_min_study_num": 105, "day_study_num": 6687, "day_study_time": "993.38" }, { "statis_date": "02:15:00", "5_min_study_num": 108, "day_study_num": 6795, "day_study_time": "1009.61" }, { "statis_date": "02:20:00", "5_min_study_num": 108, "day_study_num": 6904, "day_study_time": "1025.74" }, { "statis_date": "02:25:00", "5_min_study_num": 90, "day_study_num": 6994, "day_study_time": "1039.22" }, { "statis_date": "02:30:00", "5_min_study_num": 93, "day_study_num": 7088, "day_study_time": "1053.15" }, { "statis_date": "02:35:00", "5_min_study_num": 88, "day_study_num": 7176, "day_study_time": "1066.35" }, { "statis_date": "02:40:00", "5_min_study_num": 84, "day_study_num": 7260, "day_study_time": "1078.88" }, { "statis_date": "02:45:00", "5_min_study_num": 82, "day_study_num": 7342, "day_study_time": "1091.19" }, { "statis_date": "02:50:00", "5_min_study_num": 85, "day_study_num": 7427, "day_study_time": "1103.94" }, { "statis_date": "02:55:00", "5_min_study_num": 85, "day_study_num": 7513, "day_study_time": "1116.58" }, { "statis_date": "03:00:00", "5_min_study_num": 74, "day_study_num": 7587, "day_study_time": "1127.70" }, { "statis_date": "03:05:00", "5_min_study_num": 74, "day_study_num": 7661, "day_study_time": "1138.82" }, { "statis_date": "03:10:00", "5_min_study_num": 74, "day_study_num": 7735, "day_study_time": "1149.89" }, { "statis_date": "03:15:00", "5_min_study_num": 77, "day_study_num": 7812, "day_study_time": "1161.41" }, { "statis_date": "03:20:00", "5_min_study_num": 75, "day_study_num": 7887, "day_study_time": "1172.64" }, { "statis_date": "03:25:00", "5_min_study_num": 77, "day_study_num": 7964, "day_study_time": "1184.10" }, { "statis_date": "03:30:00", "5_min_study_num": 68, "day_study_num": 8033, "day_study_time": "1194.44" }, { "statis_date": "03:35:00", "5_min_study_num": 73, "day_study_num": 8106, "day_study_time": "1205.39" }, { "statis_date": "03:40:00", "5_min_study_num": 74, "day_study_num": 8180, "day_study_time": "1216.51" }, { "statis_date": "03:45:00", "5_min_study_num": 81, "day_study_num": 8261, "day_study_time": "1228.59" }, { "statis_date": "03:50:00", "5_min_study_num": 86, "day_study_num": 8348, "day_study_time": "1241.46" }, { "statis_date": "03:55:00", "5_min_study_num": 92, "day_study_num": 8440, "day_study_time": "1255.22" }, { "statis_date": "04:00:00", "5_min_study_num": 88, "day_study_num": 8528, "day_study_time": "1268.42" }, { "statis_date": "04:05:00", "5_min_study_num": 84, "day_study_num": 8612, "day_study_time": "1281.00" }, { "statis_date": "04:10:00", "5_min_study_num": 82, "day_study_num": 8695, "day_study_time": "1293.19" }, { "statis_date": "04:15:00", "5_min_study_num": 102, "day_study_num": 8797, "day_study_time": "1308.53" }, { "statis_date": "04:20:00", "5_min_study_num": 107, "day_study_num": 8905, "day_study_time": "1324.60" }, { "statis_date": "04:25:00", "5_min_study_num": 117, "day_study_num": 9022, "day_study_time": "1342.12" }, { "statis_date": "04:30:00", "5_min_study_num": 105, "day_study_num": 9128, "day_study_time": "1357.85" }, { "statis_date": "04:35:00", "5_min_study_num": 98, "day_study_num": 9226, "day_study_time": "1372.52" }, { "statis_date": "04:40:00", "5_min_study_num": 90, "day_study_num": 9317, "day_study_time": "1385.94" }, { "statis_date": "04:45:00", "5_min_study_num": 95, "day_study_num": 9412, "day_study_time": "1400.15" }, { "statis_date": "04:50:00", "5_min_study_num": 99, "day_study_num": 9511, "day_study_time": "1414.99" }, { "statis_date": "04:55:00", "5_min_study_num": 114, "day_study_num": 9626, "day_study_time": "1432.07" }, { "statis_date": "05:00:00", "5_min_study_num": 121, "day_study_num": 9748, "day_study_time": "1450.16" }, { "statis_date": "05:05:00", "5_min_study_num": 112, "day_study_num": 9860, "day_study_time": "1466.90" }, { "statis_date": "05:10:00", "5_min_study_num": 129, "day_study_num": 9990, "day_study_time": "1486.17" }, { "statis_date": "05:15:00", "5_min_study_num": 129, "day_study_num": 10120, "day_study_time": "1505.44" }, { "statis_date": "05:20:00", "5_min_study_num": 141, "day_study_num": 10261, "day_study_time": "1526.45" }, { "statis_date": "05:25:00", "5_min_study_num": 171, "day_study_num": 10433, "day_study_time": "1552.01" }, { "statis_date": "05:30:00", "5_min_study_num": 179, "day_study_num": 10612, "day_study_time": "1578.75" }, { "statis_date": "05:35:00", "5_min_study_num": 193, "day_study_num": 10806, "day_study_time": "1607.58" }, { "statis_date": "05:40:00", "5_min_study_num": 205, "day_study_num": 11012, "day_study_time": "1638.25" }, { "statis_date": "05:45:00", "5_min_study_num": 205, "day_study_num": 11218, "day_study_time": "1668.93" }, { "statis_date": "05:50:00", "5_min_study_num": 202, "day_study_num": 11421, "day_study_time": "1699.15" }, { "statis_date": "05:55:00", "5_min_study_num": 218, "day_study_num": 11639, "day_study_time": "1731.62" }, { "statis_date": "06:00:00", "5_min_study_num": 258, "day_study_num": 11898, "day_study_time": "1770.10" }, { "statis_date": "06:05:00", "5_min_study_num": 258, "day_study_num": 12157, "day_study_time": "1808.48" }, { "statis_date": "06:10:00", "5_min_study_num": 281, "day_study_num": 12438, "day_study_time": "1850.22" }, { "statis_date": "06:15:00", "5_min_study_num": 306, "day_study_num": 12744, "day_study_time": "1895.78" }, { "statis_date": "06:20:00", "5_min_study_num": 319, "day_study_num": 13064, "day_study_time": "1943.19" }, { "statis_date": "06:25:00", "5_min_study_num": 349, "day_study_num": 13413, "day_study_time": "1995.05" }, { "statis_date": "06:30:00", "5_min_study_num": 367, "day_study_num": 13780, "day_study_time": "2049.54" }, { "statis_date": "06:35:00", "5_min_study_num": 373, "day_study_num": 14153, "day_study_time": "2105.04" }, { "statis_date": "06:40:00", "5_min_study_num": 401, "day_study_num": 14555, "day_study_time": "2164.65" }, { "statis_date": "06:45:00", "5_min_study_num": 424, "day_study_num": 14979, "day_study_time": "2227.57" }, { "statis_date": "06:50:00", "5_min_study_num": 442, "day_study_num": 15422, "day_study_time": "2293.19" }, { "statis_date": "06:55:00", "5_min_study_num": 451, "day_study_num": 15873, "day_study_time": "2360.15" }, { "statis_date": "07:00:00", "5_min_study_num": 489, "day_study_num": 16362, "day_study_time": "2432.79" }, { "statis_date": "07:05:00", "5_min_study_num": 496, "day_study_num": 16858, "day_study_time": "2506.44" }, { "statis_date": "07:10:00", "5_min_study_num": 519, "day_study_num": 17378, "day_study_time": "2583.63" }, { "statis_date": "07:15:00", "5_min_study_num": 520, "day_study_num": 17898, "day_study_time": "2660.94" }, { "statis_date": "07:20:00", "5_min_study_num": 502, "day_study_num": 18400, "day_study_time": "2735.49" }, { "statis_date": "07:25:00", "5_min_study_num": 508, "day_study_num": 18909, "day_study_time": "2810.89" }, { "statis_date": "07:30:00", "5_min_study_num": 540, "day_study_num": 19449, "day_study_time": "2891.23" }, { "statis_date": "07:35:00", "5_min_study_num": 568, "day_study_num": 20018, "day_study_time": "2975.55" }, { "statis_date": "07:40:00", "5_min_study_num": 590, "day_study_num": 20608, "day_study_time": "3063.19" }, { "statis_date": "07:45:00", "5_min_study_num": 622, "day_study_num": 21231, "day_study_time": "3155.66" }, { "statis_date": "07:50:00", "5_min_study_num": 713, "day_study_num": 21944, "day_study_time": "3261.45" }, { "statis_date": "07:55:00", "5_min_study_num": 803, "day_study_num": 22748, "day_study_time": "3380.72" }, { "statis_date": "08:00:00", "5_min_study_num": 921, "day_study_num": 23669, "day_study_time": "3517.40" }, { "statis_date": "08:05:00", "5_min_study_num": 1032, "day_study_num": 24702, "day_study_time": "3670.71" }, { "statis_date": "08:10:00", "5_min_study_num": 1211, "day_study_num": 25914, "day_study_time": "3850.43" }, { "statis_date": "08:15:00", "5_min_study_num": 1464, "day_study_num": 27378, "day_study_time": "4067.57" }, { "statis_date": "08:20:00", "5_min_study_num": 1746, "day_study_num": 29124, "day_study_time": "4326.67" }, { "statis_date": "08:25:00", "5_min_study_num": 2086, "day_study_num": 31210, "day_study_time": "4636.16" }, { "statis_date": "08:30:00", "5_min_study_num": 2608, "day_study_num": 33818, "day_study_time": "5023.08" }, { "statis_date": "08:35:00", "5_min_study_num": 3113, "day_study_num": 36932, "day_study_time": "5484.93" }, { "statis_date": "08:40:00", "5_min_study_num": 3459, "day_study_num": 40392, "day_study_time": "5998.19" }, { "statis_date": "08:45:00", "5_min_study_num": 3668, "day_study_num": 44061, "day_study_time": "6542.35" }, { "statis_date": "08:50:00", "5_min_study_num": 3555, "day_study_num": 47616, "day_study_time": "7069.71" }, { "statis_date": "08:55:00", "5_min_study_num": 3639, "day_study_num": 51255, "day_study_time": "7609.49" }, { "statis_date": "09:00:00", "5_min_study_num": 4159, "day_study_num": 55415, "day_study_time": "8226.51" }, { "statis_date": "09:05:00", "5_min_study_num": 4038, "day_study_num": 59453, "day_study_time": "8825.50" }, { "statis_date": "09:10:00", "5_min_study_num": 3728, "day_study_num": 63182, "day_study_time": "9378.59" }, { "statis_date": "09:15:00", "5_min_study_num": 3533, "day_study_num": 66716, "day_study_time": "9902.75" }, { "statis_date": "09:20:00", "5_min_study_num": 3630, "day_study_num": 70346, "day_study_time": "10441.18" }, { "statis_date": "09:25:00", "5_min_study_num": 3841, "day_study_num": 74187, "day_study_time": "11010.96" }, { "statis_date": "09:30:00", "5_min_study_num": 4119, "day_study_num": 78307, "day_study_time": "11621.91" }, { "statis_date": "09:35:00", "5_min_study_num": 4117, "day_study_num": 82424, "day_study_time": "12232.54" }, { "statis_date": "09:40:00", "5_min_study_num": 4265, "day_study_num": 86689, "day_study_time": "12865.24" }, { "statis_date": "09:45:00", "5_min_study_num": 4175, "day_study_num": 90865, "day_study_time": "13484.57" }, { "statis_date": "09:50:00", "5_min_study_num": 4031, "day_study_num": 94896, "day_study_time": "14082.49" }, { "statis_date": "09:55:00", "5_min_study_num": 4040, "day_study_num": 98936, "day_study_time": "14681.76" }, { "statis_date": "10:00:00", "5_min_study_num": 4576, "day_study_num": 103513, "day_study_time": "15360.59" }, { "statis_date": "10:05:00", "5_min_study_num": 4459, "day_study_num": 107972, "day_study_time": "16021.94" }, { "statis_date": "10:10:00", "5_min_study_num": 4111, "day_study_num": 112083, "day_study_time": "16631.71" }, { "statis_date": "10:15:00", "5_min_study_num": 3704, "day_study_num": 115787, "day_study_time": "17181.15" }, { "statis_date": "10:20:00", "5_min_study_num": 3643, "day_study_num": 119431, "day_study_time": "17721.61" }, { "statis_date": "10:25:00", "5_min_study_num": 3519, "day_study_num": 122950, "day_study_time": "18243.75" }, { "statis_date": "10:30:00", "5_min_study_num": 3900, "day_study_num": 126851, "day_study_time": "18822.18" }, { "statis_date": "10:35:00", "5_min_study_num": 3998, "day_study_num": 130849, "day_study_time": "19415.21" }, { "statis_date": "10:40:00", "5_min_study_num": 3653, "day_study_num": 134503, "day_study_time": "19957.07" }, { "statis_date": "10:45:00", "5_min_study_num": 3210, "day_study_num": 137713, "day_study_time": "20433.20" }, { "statis_date": "10:50:00", "5_min_study_num": 2996, "day_study_num": 140709, "day_study_time": "20877.58" }, { "statis_date": "10:55:00", "5_min_study_num": 2672, "day_study_num": 143382, "day_study_time": "21273.98" }, { "statis_date": "11:00:00", "5_min_study_num": 2851, "day_study_num": 146233, "day_study_time": "21696.85" }, { "statis_date": "11:05:00", "5_min_study_num": 2599, "day_study_num": 148832, "day_study_time": "22082.47" }, { "statis_date": "11:10:00", "5_min_study_num": 2375, "day_study_num": 151207, "day_study_time": "22434.77" }, { "statis_date": "11:15:00", "5_min_study_num": 2049, "day_study_num": 153257, "day_study_time": "22738.87" }, { "statis_date": "11:20:00", "5_min_study_num": 1871, "day_study_num": 155129, "day_study_time": "23016.62" }, { "statis_date": "11:25:00", "5_min_study_num": 1871, "day_study_num": 157001, "day_study_time": "23294.38" }, { "statis_date": "11:30:00", "5_min_study_num": 1731, "day_study_num": 158733, "day_study_time": "23551.29" }, { "statis_date": "11:35:00", "5_min_study_num": 1611, "day_study_num": 160344, "day_study_time": "23790.27" }, { "statis_date": "11:40:00", "5_min_study_num": 1526, "day_study_num": 161871, "day_study_time": "24016.84" }, { "statis_date": "11:45:00", "5_min_study_num": 1432, "day_study_num": 163303, "day_study_time": "24229.43" }, { "statis_date": "11:50:00", "5_min_study_num": 1366, "day_study_num": 164670, "day_study_time": "24432.24" }, { "statis_date": "11:55:00", "5_min_study_num": 1329, "day_study_num": 165999, "day_study_time": "24629.48" }, { "statis_date": "12:00:00", "5_min_study_num": 1327, "day_study_num": 167326, "day_study_time": "24826.33" }, { "statis_date": "12:05:00", "5_min_study_num": 1240, "day_study_num": 168567, "day_study_time": "25010.49" }, { "statis_date": "12:10:00", "5_min_study_num": 1178, "day_study_num": 169746, "day_study_time": "25185.38" }, { "statis_date": "12:15:00", "5_min_study_num": 1163, "day_study_num": 170910, "day_study_time": "25358.02" }, { "statis_date": "12:20:00", "5_min_study_num": 1137, "day_study_num": 172047, "day_study_time": "25526.84" }, { "statis_date": "12:25:00", "5_min_study_num": 1105, "day_study_num": 173153, "day_study_time": "25691.00" }, { "statis_date": "12:30:00", "5_min_study_num": 1130, "day_study_num": 174283, "day_study_time": "25858.64" }, { "statis_date": "12:35:00", "5_min_study_num": 1139, "day_study_num": 175423, "day_study_time": "26027.74" }, { "statis_date": "12:40:00", "5_min_study_num": 1130, "day_study_num": 176553, "day_study_time": "26195.38" }, { "statis_date": "12:45:00", "5_min_study_num": 1118, "day_study_num": 177671, "day_study_time": "26361.28" }, { "statis_date": "12:50:00", "5_min_study_num": 1088, "day_study_num": 178760, "day_study_time": "26522.85" }, { "statis_date": "12:55:00", "5_min_study_num": 1075, "day_study_num": 179835, "day_study_time": "26682.40" }, { "statis_date": "13:00:00", "5_min_study_num": 1101, "day_study_num": 180937, "day_study_time": "26845.94" }, { "statis_date": "13:05:00", "5_min_study_num": 1051, "day_study_num": 181988, "day_study_time": "27001.89" }, { "statis_date": "13:10:00", "5_min_study_num": 1079, "day_study_num": 183068, "day_study_time": "27162.06" }, { "statis_date": "13:15:00", "5_min_study_num": 1100, "day_study_num": 184169, "day_study_time": "27325.43" }, { "statis_date": "13:20:00", "5_min_study_num": 1075, "day_study_num": 185244, "day_study_time": "27484.99" }, { "statis_date": "13:25:00", "5_min_study_num": 1101, "day_study_num": 186346, "day_study_time": "27648.41" }, { "statis_date": "13:30:00", "5_min_study_num": 1122, "day_study_num": 187468, "day_study_time": "27814.93" }, { "statis_date": "13:35:00", "5_min_study_num": 1120, "day_study_num": 188588, "day_study_time": "27981.11" }, { "statis_date": "13:40:00", "5_min_study_num": 1078, "day_study_num": 189667, "day_study_time": "28141.16" }, { "statis_date": "13:45:00", "5_min_study_num": 1102, "day_study_num": 190770, "day_study_time": "28304.87" }, { "statis_date": "13:50:00", "5_min_study_num": 1119, "day_study_num": 191889, "day_study_time": "28470.88" }, { "statis_date": "13:55:00", "5_min_study_num": 1277, "day_study_num": 193166, "day_study_time": "28660.37" }, { "statis_date": "14:00:00", "5_min_study_num": 1478, "day_study_num": 194644, "day_study_time": "28879.70" }, { "statis_date": "14:05:00", "5_min_study_num": 1541, "day_study_num": 196186, "day_study_time": "29108.40" }, { "statis_date": "14:10:00", "5_min_study_num": 1518, "day_study_num": 197705, "day_study_time": "29333.80" }, { "statis_date": "14:15:00", "5_min_study_num": 1477, "day_study_num": 199182, "day_study_time": "29553.01" }, { "statis_date": "14:20:00", "5_min_study_num": 1487, "day_study_num": 200669, "day_study_time": "29773.63" }, { "statis_date": "14:25:00", "5_min_study_num": 1504, "day_study_num": 202174, "day_study_time": "29996.89" }, { "statis_date": "14:30:00", "5_min_study_num": 1524, "day_study_num": 203699, "day_study_time": "30223.18" }, { "statis_date": "14:35:00", "5_min_study_num": 1530, "day_study_num": 205229, "day_study_time": "30450.20" }, { "statis_date": "14:40:00", "5_min_study_num": 1509, "day_study_num": 206739, "day_study_time": "30674.14" }, { "statis_date": "14:45:00", "5_min_study_num": 1574, "day_study_num": 208313, "day_study_time": "30907.79" }, { "statis_date": "14:50:00", "5_min_study_num": 1571, "day_study_num": 209885, "day_study_time": "31140.88" }, { "statis_date": "14:55:00", "5_min_study_num": 1562, "day_study_num": 211447, "day_study_time": "31372.63" }, { "statis_date": "15:00:00", "5_min_study_num": 1674, "day_study_num": 213121, "day_study_time": "31621.06" }, { "statis_date": "15:05:00", "5_min_study_num": 1702, "day_study_num": 214824, "day_study_time": "31873.64" }, { "statis_date": "15:10:00", "5_min_study_num": 1716, "day_study_num": 216541, "day_study_time": "32128.25" }, { "statis_date": "15:15:00", "5_min_study_num": 1807, "day_study_num": 218348, "day_study_time": "32396.34" }, { "statis_date": "15:20:00", "5_min_study_num": 1823, "day_study_num": 220171, "day_study_time": "32666.79" }, { "statis_date": "15:25:00", "5_min_study_num": 1859, "day_study_num": 222031, "day_study_time": "32942.69" }, { "statis_date": "15:30:00", "5_min_study_num": 1841, "day_study_num": 223872, "day_study_time": "33215.83" }, { "statis_date": "15:35:00", "5_min_study_num": 1859, "day_study_num": 225732, "day_study_time": "33491.73" }, { "statis_date": "15:40:00", "5_min_study_num": 1817, "day_study_num": 227549, "day_study_time": "33761.29" }, { "statis_date": "15:45:00", "5_min_study_num": 1768, "day_study_num": 229318, "day_study_time": "34023.59" }, { "statis_date": "15:50:00", "5_min_study_num": 1840, "day_study_num": 231158, "day_study_time": "34296.68" }, { "statis_date": "15:55:00", "5_min_study_num": 2026, "day_study_num": 233184, "day_study_time": "34597.19" }, { "statis_date": "16:00:00", "5_min_study_num": 2044, "day_study_num": 235229, "day_study_time": "34900.50" }, { "statis_date": "16:05:00", "5_min_study_num": 2029, "day_study_num": 237258, "day_study_time": "35201.57" }, { "statis_date": "16:10:00", "5_min_study_num": 1954, "day_study_num": 239212, "day_study_time": "35491.41" }, { "statis_date": "16:15:00", "5_min_study_num": 1882, "day_study_num": 241094, "day_study_time": "35770.62" }, { "statis_date": "16:20:00", "5_min_study_num": 1800, "day_study_num": 242895, "day_study_time": "36037.76" }, { "statis_date": "16:25:00", "5_min_study_num": 1818, "day_study_num": 244713, "day_study_time": "36307.42" }, { "statis_date": "16:30:00", "5_min_study_num": 1853, "day_study_num": 246567, "day_study_time": "36582.42" }, { "statis_date": "16:35:00", "5_min_study_num": 1821, "day_study_num": 248388, "day_study_time": "36852.65" }, { "statis_date": "16:40:00", "5_min_study_num": 1752, "day_study_num": 250140, "day_study_time": "37112.65" }, { "statis_date": "16:45:00", "5_min_study_num": 1695, "day_study_num": 251836, "day_study_time": "37364.23" }, { "statis_date": "16:50:00", "5_min_study_num": 1680, "day_study_num": 253516, "day_study_time": "37613.50" }, { "statis_date": "16:55:00", "5_min_study_num": 1694, "day_study_num": 255210, "day_study_time": "37864.90" }, { "statis_date": "17:00:00", "5_min_study_num": 1725, "day_study_num": 256936, "day_study_time": "38120.86" }, { "statis_date": "17:05:00", "5_min_study_num": 1709, "day_study_num": 258646, "day_study_time": "38374.51" }, { "statis_date": "17:10:00", "5_min_study_num": 1700, "day_study_num": 260346, "day_study_time": "38626.70" }, { "statis_date": "17:15:00", "5_min_study_num": 1662, "day_study_num": 262009, "day_study_time": "38873.44" }, { "statis_date": "17:20:00", "5_min_study_num": 1632, "day_study_num": 263642, "day_study_time": "39115.68" }, { "statis_date": "17:25:00", "5_min_study_num": 1617, "day_study_num": 265259, "day_study_time": "39355.63" }, { "statis_date": "17:30:00", "5_min_study_num": 1656, "day_study_num": 266916, "day_study_time": "39601.47" }, { "statis_date": "17:35:00", "5_min_study_num": 1584, "day_study_num": 268501, "day_study_time": "39836.58" }, { "statis_date": "17:40:00", "5_min_study_num": 1538, "day_study_num": 270039, "day_study_time": "40064.73" }, { "statis_date": "17:45:00", "5_min_study_num": 1482, "day_study_num": 271521, "day_study_time": "40284.68" }, { "statis_date": "17:50:00", "5_min_study_num": 1503, "day_study_num": 273025, "day_study_time": "40507.77" }, { "statis_date": "17:55:00", "5_min_study_num": 1495, "day_study_num": 274520, "day_study_time": "40729.63" }, { "statis_date": "18:00:00", "5_min_study_num": 1620, "day_study_num": 276141, "day_study_time": "40969.97" }, { "statis_date": "18:05:00", "5_min_study_num": 1598, "day_study_num": 277739, "day_study_time": "41206.99" }, { "statis_date": "18:10:00", "5_min_study_num": 1591, "day_study_num": 279331, "day_study_time": "41443.23" }, { "statis_date": "18:15:00", "5_min_study_num": 1545, "day_study_num": 280876, "day_study_time": "41672.44" }, { "statis_date": "18:20:00", "5_min_study_num": 1534, "day_study_num": 282410, "day_study_time": "41899.97" }, { "statis_date": "18:25:00", "5_min_study_num": 1515, "day_study_num": 283926, "day_study_time": "42124.91" }, { "statis_date": "18:30:00", "5_min_study_num": 1867, "day_study_num": 285794, "day_study_time": "42402.05" }, { "statis_date": "18:35:00", "5_min_study_num": 1975, "day_study_num": 287769, "day_study_time": "42695.03" }, { "statis_date": "18:40:00", "5_min_study_num": 1672, "day_study_num": 289441, "day_study_time": "42943.13" }, { "statis_date": "18:45:00", "5_min_study_num": 1625, "day_study_num": 291066, "day_study_time": "43184.20" }, { "statis_date": "18:50:00", "5_min_study_num": 1660, "day_study_num": 292727, "day_study_time": "43430.54" }, { "statis_date": "18:55:00", "5_min_study_num": 1673, "day_study_num": 294400, "day_study_time": "43678.69" }, { "statis_date": "19:00:00", "5_min_study_num": 1693, "day_study_num": 296094, "day_study_time": "43929.87" }, { "statis_date": "19:05:00", "5_min_study_num": 1622, "day_study_num": 297716, "day_study_time": "44170.49" }, { "statis_date": "19:10:00", "5_min_study_num": 1571, "day_study_num": 299288, "day_study_time": "44403.58" }, { "statis_date": "19:15:00", "5_min_study_num": 1551, "day_study_num": 300839, "day_study_time": "44633.69" }, { "statis_date": "19:20:00", "5_min_study_num": 1481, "day_study_num": 302321, "day_study_time": "44853.52" }, { "statis_date": "19:25:00", "5_min_study_num": 1507, "day_study_num": 303828, "day_study_time": "45077.23" }, { "statis_date": "19:30:00", "5_min_study_num": 1556, "day_study_num": 305385, "day_study_time": "45308.13" }, { "statis_date": "19:35:00", "5_min_study_num": 1499, "day_study_num": 306884, "day_study_time": "45530.60" }, { "statis_date": "19:40:00", "5_min_study_num": 1471, "day_study_num": 308355, "day_study_time": "45748.80" }, { "statis_date": "19:45:00", "5_min_study_num": 1433, "day_study_num": 309789, "day_study_time": "45961.55" }, { "statis_date": "19:50:00", "5_min_study_num": 1485, "day_study_num": 311274, "day_study_time": "46181.89" }, { "statis_date": "19:55:00", "5_min_study_num": 1552, "day_study_num": 312827, "day_study_time": "46412.17" }, { "statis_date": "20:00:00", "5_min_study_num": 1993, "day_study_num": 314820, "day_study_time": "46707.90" }, { "statis_date": "20:05:00", "5_min_study_num": 2017, "day_study_num": 316837, "day_study_time": "47007.06" }, { "statis_date": "20:10:00", "5_min_study_num": 2007, "day_study_num": 318845, "day_study_time": "47304.92" }, { "statis_date": "20:15:00", "5_min_study_num": 1948, "day_study_num": 320793, "day_study_time": "47593.91" }, { "statis_date": "20:20:00", "5_min_study_num": 1999, "day_study_num": 322793, "day_study_time": "47890.54" }, { "statis_date": "20:25:00", "5_min_study_num": 2177, "day_study_num": 324971, "day_study_time": "48213.52" }, { "statis_date": "20:30:00", "5_min_study_num": 2181, "day_study_num": 327152, "day_study_time": "48537.11" }, { "statis_date": "20:35:00", "5_min_study_num": 2143, "day_study_num": 329296, "day_study_time": "48855.20" }, { "statis_date": "20:40:00", "5_min_study_num": 1964, "day_study_num": 331260, "day_study_time": "49146.61" }, { "statis_date": "20:45:00", "5_min_study_num": 1871, "day_study_num": 333132, "day_study_time": "49424.25" }, { "statis_date": "20:50:00", "5_min_study_num": 1785, "day_study_num": 334918, "day_study_time": "49689.20" }, { "statis_date": "20:55:00", "5_min_study_num": 1723, "day_study_num": 336642, "day_study_time": "49944.98" }, { "statis_date": "21:00:00", "5_min_study_num": 1765, "day_study_num": 338407, "day_study_time": "50206.89" }, { "statis_date": "21:05:00", "5_min_study_num": 1546, "day_study_num": 339953, "day_study_time": "50436.27" }, { "statis_date": "21:10:00", "5_min_study_num": 1509, "day_study_num": 341463, "day_study_time": "50660.32" }, { "statis_date": "21:15:00", "5_min_study_num": 1468, "day_study_num": 342931, "day_study_time": "50878.07" }, { "statis_date": "21:20:00", "5_min_study_num": 1473, "day_study_num": 344404, "day_study_time": "51096.62" }, { "statis_date": "21:25:00", "5_min_study_num": 1451, "day_study_num": 345856, "day_study_time": "51311.96" }, { "statis_date": "21:30:00", "5_min_study_num": 1441, "day_study_num": 347298, "day_study_time": "51525.78" }, { "statis_date": "21:35:00", "5_min_study_num": 1432, "day_study_num": 348731, "day_study_time": "51738.36" }, { "statis_date": "21:40:00", "5_min_study_num": 1434, "day_study_num": 350165, "day_study_time": "51951.22" }, { "statis_date": "21:45:00", "5_min_study_num": 1398, "day_study_num": 351563, "day_study_time": "52158.64" }, { "statis_date": "21:50:00", "5_min_study_num": 1382, "day_study_num": 352946, "day_study_time": "52363.81" }, { "statis_date": "21:55:00", "5_min_study_num": 1338, "day_study_num": 354285, "day_study_time": "52562.34" }, { "statis_date": "22:00:00", "5_min_study_num": 1321, "day_study_num": 355606, "day_study_time": "52758.36" }, { "statis_date": "22:05:00", "5_min_study_num": 1335, "day_study_num": 356941, "day_study_time": "52956.39" }, { "statis_date": "22:10:00", "5_min_study_num": 1336, "day_study_num": 358277, "day_study_time": "53154.70" }, { "statis_date": "22:15:00", "5_min_study_num": 1302, "day_study_num": 359580, "day_study_time": "53348.02" }, { "statis_date": "22:20:00", "5_min_study_num": 1269, "day_study_num": 360849, "day_study_time": "53536.34" }, { "statis_date": "22:25:00", "5_min_study_num": 1283, "day_study_num": 362133, "day_study_time": "53726.73" }, { "statis_date": "22:30:00", "5_min_study_num": 1223, "day_study_num": 363356, "day_study_time": "53908.25" }, { "statis_date": "22:35:00", "5_min_study_num": 1194, "day_study_num": 364550, "day_study_time": "54085.49" }, { "statis_date": "22:40:00", "5_min_study_num": 1179, "day_study_num": 365730, "day_study_time": "54260.55" }, { "statis_date": "22:45:00", "5_min_study_num": 1157, "day_study_num": 366888, "day_study_time": "54432.29" }, { "statis_date": "22:50:00", "5_min_study_num": 1105, "day_study_num": 367994, "day_study_time": "54596.40" }, { "statis_date": "22:55:00", "5_min_study_num": 1079, "day_study_num": 369073, "day_study_time": "54756.62" }, { "statis_date": "23:00:00", "5_min_study_num": 1037, "day_study_num": 370111, "day_study_time": "54910.56" }, { "statis_date": "23:05:00", "5_min_study_num": 1003, "day_study_num": 371115, "day_study_time": "55059.49" }, { "statis_date": "23:10:00", "5_min_study_num": 948, "day_study_num": 372063, "day_study_time": "55200.28" }, { "statis_date": "23:15:00", "5_min_study_num": 882, "day_study_num": 372946, "day_study_time": "55331.29" }, { "statis_date": "23:20:00", "5_min_study_num": 849, "day_study_num": 373795, "day_study_time": "55457.30" }, { "statis_date": "23:25:00", "5_min_study_num": 819, "day_study_num": 374615, "day_study_time": "55578.98" }, { "statis_date": "23:30:00", "5_min_study_num": 777, "day_study_num": 375392, "day_study_time": "55694.32" }, { "statis_date": "23:35:00", "5_min_study_num": 738, "day_study_num": 376131, "day_study_time": "55803.93" }, { "statis_date": "23:40:00", "5_min_study_num": 698, "day_study_num": 376829, "day_study_time": "55907.47" }, { "statis_date": "23:45:00", "5_min_study_num": 655, "day_study_num": 377485, "day_study_time": "56004.77" }, { "statis_date": "23:50:00", "5_min_study_num": 613, "day_study_num": 378098, "day_study_time": "56095.96" }, { "statis_date": "23:55:00", "5_min_study_num": 566, "day_study_num": 378665, "day_study_time": "56180.00" }],
}
},
created() {
},
mounted() {
this.paintSvg();
this.numberRoll(this.dayStudyData);
this.moveArr = this.randomDivide(this.newArr[this.count], 60)
this.moveArr1 = this.randomDivide(this.newArr1[this.count], 60)
this.fourMinutes()
this.timer = setInterval(function () {
this.fourMinutes();
}.bind(this), 1000 * 6)
setInterval(function () {
clearInterval(this.timer)
this.paintSvg();
this.moveArr = this.randomDivide(this.newArr[this.count], 60)
this.moveArr1 = this.randomDivide(this.newArr1[this.count], 60)
this.count++;
this.countMove = 0;
this.timer = setInterval(function () {
this.fourMinutes();
}.bind(this), 1000 * 6)
}.bind(this), 5 * 60 * 1000)
},
destroyed() {
if (this.timer) {
clearInterval(this.timer);
this.timer = null;
}
},
computed: {
perimeter: function () {
return 2 * Math.PI * 270 / 360 * parseInt(50 - parseFloat(this.strokeWidth) / 2, 10);
}
},
methods: {
fourMinutes() {
this.countUpFun('aiTimes', this.totalHours, Number(this.totalHours) + this.moveArr1[this.countMove], 0)
this.item.num = Number(this.item.num) + Number(this.moveArr[this.countMove]);
this.totalHours = Number(this.totalHours) + Number(this.moveArr1[this.countMove]);
this.countMove++;
this.percentage = (this.totalHours / this.scaleLabel[this.scaleLabel.length - 1] / 1000) * 100
this.paintSvg()
},
countUpFun: function (id, startVal, endVal, decimals) {
decimals = decimals || 0;
var option = new CountUp(document.getElementById(id), startVal, endVal, decimals, 2.5)
option.start();
},
numberRoll: function (arr) {
for (var i = 0; i < arr.length; i++) {
var min_5_study_num,
min_5_study_time;
if (i > 1) {
min_5_study_num = arr[i].day_study_num - arr[i - 1].day_study_num;
min_5_study_time = arr[i].day_study_time - arr[i - 1].day_study_time;
} else {
min_5_study_num = arr[0].day_study_num;
min_5_study_time = arr[0].day_study_time;
}
if (this.matchTime(arr[i].statis_date) == 1) {
this.studyNum += Number(min_5_study_num);
this.totalHours += Number(min_5_study_time);
} else {
this.newArr.push(Number(min_5_study_num))
this.newArr1.push(Number(min_5_study_time))
}
}
},
randomDivide: function (total, nums) {
let rest = total;
let result = Array.apply(null, { length: nums })
.map((n, i) => nums - i)
.map(n => {
const v = 1 + Math.floor(Math.random() * (rest / n * 2 - 1))
rest -= v;
return v;
})
result[nums - 1] += rest;
return result;
},
figureFormat(figure) {
return parseFloat(figure.toString()).toLocaleString()
},
getRandomNum(total, times) {
let remainNum;
let remainSize;
let min = 0.01;
let num;
let result = [];
for (let i = 1; i <= times; i++) {
remainSize = times - i;
if (i === times) {
num = Math.round(total * 100) / 100;
}
let max = total / remainSize * 2;
num = Math.random() * max;
num = num < min ? 0.01 : num;
num = Math.floor(num * 100) / 100;
total = total - num;
result.push(num);
}
return result;
},
paintSvg() {
var bgPath = document.getElementById('bgPath'),
barPath = document.getElementById('barPath');
var barStyle = this.barStyle(),
baseStyle = this.styleStr(this.pathStyle(this.color)),
barPathStyle = this.styleStr(this.circlePathStyle());
if (!!bgPath.setAttribute) {
bgPath.setAttribute('d', this.radianTrackPath());
bgPath.setAttribute('style', this.styleStr(this.pathStyle(this.bgColor)))
}
if (!!barPath.setAttribute) {
barPath.setAttribute('d', this.radianTrackPath());
barPath.setAttribute('style', baseStyle + barPathStyle)
}
},
styleStr: function (obj) {
var str = "";
for (var k in obj) {
str += k + ":" + obj[k] + ";";
}
return str;
},
barStyle: function barStyle() {
var style = {};
style.width = this.percentage + '%';
style.backgroundColor = this.color;
return style;
},
radianTrackPath: function radianTrackPath() {
var radius = parseInt(50 - parseFloat(this.strokeWidth) / 2, 10);
var segment = parseFloat(radius / Math.sqrt(2)).toFixed(1);
return 'M 50 50 m -' + segment + " " + segment + ' a ' + radius + ' ' + radius + ' 0 0 1 '
+ segment + ' -' + (parseFloat(segment) + radius) + ' a ' + radius + ' ' + radius + ' 0 0 1 '
+ segment + ' ' + (parseFloat(segment) + radius);
},
circlePathStyle: function circlePathStyle() {
var perimeter = this.perimeter;
return {
"stroke-dasharray": parseFloat(perimeter).toFixed(1) + 'px,' + parseFloat(perimeter).toFixed(1) + 'px',
"stroke-dashoffset": parseFloat((1 - this.percentage / 100) * perimeter).toFixed(1) + 'px',
};
},
pathStyle: function bgPathStyle(color) {
return {
stroke: color,
"stroke-width": this.strokeWidth,
fill: "none",
"stroke-linecap": "round"
}
},
getData: function () {
this.percentage = (this.totalHours / this.scaleLabel[this.scaleLabel.length - 1] / 1000) * 100
},
match5minute(str) {
var time = (new Date().getHours() + ':' + new Date().getMinutes()).split(':');
str = str.split(':');
var minutesMatch = (parseInt(time[1]) - parseInt(str[1])) < 5 && (parseInt(time[1]) - parseInt(str[1]) >= 0);
var hourMatch = (parseInt(time[0]) == parseInt(str[0]));
if (hourMatch && minutesMatch) {
return true;
} else {
return false;
}
},
matchTime(str) {
var time = (new Date().getHours() + ':' + new Date().getMinutes()).split(':');
str = str.split(':');
if (parseInt(time[0]) > parseInt(str[0])) {
return 1
} else if (parseInt(time[0]) < parseInt(str[0])) {
return 0
} else {
if (parseInt(time[1]) > parseInt(str[1])) {
return 1
} else if (parseInt(time[1]) < parseInt(str[1])) {
return 0
} else {
return 1
}
}
},
}
})
<div id="app">
<template>
<div class="meter-graph-wrap">
<div class="meter-graph">
<div class="meter-wrap">
<div class="meter-content">
<svg viewBox="0 0 100 100">
<path id="bgPath" />
<path id="barPath" />
</svg>
</div>
<div class="meter-des">
<span v-for="(value, index) in scaleLabel" :key="index" :class="['scaleLabel', 'scaleLabel'+ index]" :ref="'scaleLabel' + index">
{{value}}K
</span>
</div>
<div class="meter-count">
<h1><span id="aiTimes">{{figureFormat(totalHours)}}</span>h</h1>
</div>
</div>
</div>
</div>
</template>
</div>
.meter-graph-title {
display: flex;
font-size: 12px;
}
.meter-graph-title h1 {
width: 50%;
padding: 16px 0 0 20px;
}
.meter-graph-title em {
display: block;
position: relative;
top: 3px;
}
.meter-graph-title h2 {
width: 50%;
color: #fff;
text-align: right;
padding: 17px 28px 0 0;
}
.meter-graph-title h2 span {
font-size: 24px;
}
.meter-graph-wrap {
position: absolute;
width: 220px;
height: 268px;
left: 228px;
color: #279cff;
}
.meter-graph {
width: 200px;
height: 200px;
background: url(../../../../assets/images/bg/em_meter_bg.png) no-repeat;
background-position: 20px 20px;
margin-top: 40px;
margin-left: 15px;
}
.meter-wrap {
position: absolute;
left: 58px;
top: 84px;
width: 120px;
height: 120px;
}
.meter-content {
width: 120px;
height: 120px;
}
.meter-count {
position: absolute;
left: 0px;
top: 45px;
width: 100%;
text-align: center;
}
.meter-count h1 em {
font-size: 12px;
display: block;
position: relative;
top: 3px;
}
.meter-count h1 #aiTimes {
font-size: 24px;
}
.meter-count h1 {
color: #fff;
font-size: 24px;
}
.scaleLabel {
position: absolute;
}
.scaleLabel0 {
left: 2px;
top: 98px;
transform: rotate(-135deg);
}
.scaleLabel1 {
left: -20px;
top: 50px;
transform: rotate(-90deg);
}
.scaleLabel2 {
left: -2px;
top: 6px;
transform: rotate(-45deg);
}
.scaleLabel3 {
left: 46px;
top: -14px;
}
.scaleLabel4 {
left: 94px;
top: 6px;
transform: rotate(45deg);
}
.scaleLabel5 {
left: 114px;
top: 52px;
transform: rotate(90deg);
}
.scaleLabel6 {
left: 97px;
top: 97px;
transform: rotate(130deg);
}