index.html 33 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608
  1. <head>
  2. <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"
  3. integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
  4. <script src="https://cdn.jsdelivr.net/npm/echarts@4.3.0/dist/echarts.min.js"></script>
  5. <script src="https://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
  6. <link rel="preconnect" href="https://fonts.gstatic.com">
  7. <link href="https://fonts.loli.net/css2?family=Anonymous+Pro:ital,wght@0,400;0,700;1,400;1,700
  8. &family=Noto+Serif+SC:wght@300;400;500;600;700&display=swap" rel="stylesheet">
  9. <link rel="stylesheet" href="../css/style.css">
  10. <!-- <link rel="stylesheet" href="/css/style.css"> -->
  11. <script type="text/javascript">
  12. function decimal(x, n) {
  13. x = Math.round(x * 10 ** n) / 10 ** n;
  14. return x.toFixed(n);
  15. }
  16. function processFiles(event) {
  17. var file = event.target.files[0];
  18. var message = document.getElementById("message");
  19. var upBtn = document.getElementById('upbtn');
  20. var upIcon = document.getElementById('upicon');
  21. message.innerHTML = file.name + " - " + file.size + " 字节 - " + file.type + " - 正在读取...";
  22. upBtn.classList.remove('btn-danger');
  23. upBtn.classList.remove('btn-default');
  24. upBtn.classList.add('btn-default');
  25. upIcon.classList.remove('glyphicon-exclamation-sign');
  26. upIcon.classList.remove('glyphicon-open');
  27. upIcon.classList.add('glyphicon-open');
  28. var reader = new FileReader();
  29. var content = "";
  30. reader.onload = function (event) {
  31. try {
  32. var output = document.getElementById("fileOutput");
  33. var object = eval("(" + event.target.result + ")");
  34. var classText = "", gradingText = "";
  35. var seIds = [], seNames = [];
  36. seIds = object.data.seIds;
  37. for (var i = 0; i < seIds.length; i++) {
  38. for (var j = 0; j < seIds.length; j++) {
  39. if (object.data.multiExam.singleExams[i].seId == seIds[j]) {
  40. seNames[j] = object.data.multiExam.singleExams[i].seCourseName;
  41. }
  42. }
  43. }
  44. var seNameDic = {};
  45. for (var i = 0; i < seIds.length; i++) {
  46. seNameDic[seIds[i]] = seNames[i];
  47. }
  48. seNameDic["0"] = "总分";
  49. for (var i = 0; i < object.data.singleExamClassYsScores.length; i++) {
  50. seNameDic[object.data.singleExamClassYsScores[i].seId + "Ys"] = seNameDic[object.data.singleExamClassYsScores[i].seId] + " " + object.data.singleExamClassYsScores[i].ysClassId;
  51. }
  52. var seIdDic = {};
  53. for (var i = 0; i < seIds.length; i++) {
  54. for (var j = 0; j < seIds.length; j++) {
  55. if (object.data.multiExamStudentScore.singleExamStudentScores[j].seId == seIds[i]) {
  56. seIdDic[j] = i;
  57. }
  58. }
  59. }
  60. var scoreP = {}, avgP = {};
  61. for (var i = 0; i < seIds.length; i++) {
  62. scoreP[object.data.multiExamStudentScore.singleExamStudentScores[i].seId] = object.data.multiExamStudentScore.singleExamStudentScores[i].essScore;
  63. }
  64. for (var i = 0; i < seIds.length; i++) {
  65. avgP[object.data.multiExamStudentScore.singleExamStudentScores[i].seId] = object.data.singleExamClassScores[i].secsAvgScore;
  66. }
  67. var scoreRate = {};
  68. for (var i = 0; i < seIds.length; i++) {
  69. scoreRate[object.data.multiExamStudentScore.singleExamStudentScores[i].seId] = decimal(object.data.multiExamStudentScore.singleExamStudentScores[i].essScore / object.data.multiExam.singleExams[seIdDic[i]].seFullScore, 3);
  70. }
  71. scoreRate["0"] = decimal(object.data.multiExamStudentScore.messScore / object.data.multiExam.meFullScore, 3);
  72. var classOrderP = {}, gradeOrderP = {};
  73. for (var i = 0; i < seIds.length; i++) {
  74. classOrderP[object.data.multiExamStudentScore.singleExamStudentScores[i].seId] = object.data.multiExamStudentScore.singleExamStudentScores[i].essClassOrder;
  75. }
  76. for (var i = 0; i < seIds.length; i++) {
  77. gradeOrderP[object.data.multiExamStudentScore.singleExamStudentScores[i].seId] = object.data.multiExamStudentScore.singleExamStudentScores[i].essGradeOrder;
  78. }
  79. classOrderP["0"] = object.data.multiExamStudentScore.messClassOrder;
  80. gradeOrderP["0"] = object.data.multiExamStudentScore.messGradeOrder
  81. var ysClassOrderP = {};
  82. for (var i = 0; i < object.data.singleExamClassYsScores.length; i++) {
  83. for (var j = 0; j < seIds.length; j++) {
  84. if (object.data.singleExamClassYsScores[i].seId == object.data.multiExamStudentScore.singleExamStudentScores[j].seId) {
  85. ysClassOrderP[object.data.singleExamClassYsScores[i].seId + "Ys"] = object.data.multiExamStudentScore.singleExamStudentScores[j].essYsClassOrder;
  86. }
  87. }
  88. }
  89. var classOrder = {}, ysClassOrder = {};
  90. for (var i = 0; i < seIds.length; i++) {
  91. classOrder[object.data.multiExamStudentScore.singleExamStudentScores[i].seId] = decimal(1 - object.data.multiExamStudentScore.singleExamStudentScores[i].essClassOrder / object.data.singleExamClassScores[i].secsStudentCount, 3);
  92. }
  93. for (var i = 0; i < object.data.singleExamClassYsScores.length; i++) {
  94. for (var j = 0; j < seIds.length; j++) {
  95. if (object.data.singleExamClassYsScores[i].seId == object.data.multiExamStudentScore.singleExamStudentScores[j].seId) {
  96. ysClassOrder[object.data.singleExamClassYsScores[i].seId + "Ys"] = decimal(1 - object.data.multiExamStudentScore.singleExamStudentScores[j].essYsClassOrder / object.data.singleExamClassYsScores[i].secsStudentCount, 3);
  97. }
  98. }
  99. }
  100. classOrder["0"] = decimal(1 - object.data.multiExamStudentScore.messClassOrder / object.data.multiExamClassScores[0].mecsStudentCount, 3); + "<br>"
  101. var gradeOrder = {};
  102. for (var i = 0; i < seIds.length; i++) {
  103. gradeOrder[object.data.multiExamStudentScore.singleExamStudentScores[i].seId] = decimal(1 - object.data.multiExamStudentScore.singleExamStudentScores[i].essGradeOrder / object.data.multiExam.singleExams[seIdDic[i]].seStudentCount, 3);
  104. }
  105. gradeOrder["0"] = decimal(1 - object.data.multiExamStudentScore.messGradeOrder / object.data.multiExamSchoolScore.mecsStudentCount, 3); + "<br>"
  106. for (var i = 0; i < seIds.length; i++) {
  107. // object.data.multiExamStudentScore.singleExamStudentScores[i].seId
  108. // object.data.singleExamClassScores[i].seId
  109. // object.data.multiExam.singleExams[i].seId
  110. // seIds[i]
  111. // 前两个和后两个数据应该是能分别对上号的(1-2 3-4),用 seIdDic 连接
  112. // seIdDic {key(1-2): value(3-4),..}
  113. classText += "<h4>"
  114. + seNameDic[object.data.multiExamStudentScore.singleExamStudentScores[i].seId] + "</h4>"
  115. + "单科分数:" + object.data.multiExamStudentScore.singleExamStudentScores[i].essScore + "<br><br>"
  116. + "单科分数班级排名:" + object.data.multiExamStudentScore.singleExamStudentScores[i].essClassOrder + "<br>"
  117. + "单科班级参考人数:" + object.data.singleExamClassScores[i].secsStudentCount + "<br>"
  118. + "单科班级年级排名:" + object.data.singleExamClassScores[i].secsClassOrder + "<br>"
  119. + "单科班级:"
  120. + '<table class="table table-responsive" style="table-layout: fixed;"><tr><td>平均分</td><td>最高分</td><td>四分位数(75%)</td><td>中位数</td><td>四分位数(25%)</td><td>最低分</td></tr>'
  121. + "<tr><td>" + object.data.singleExamClassScores[i].secsAvgScore + "</td><td>" + object.data.singleExamClassScores[i].secsMaxScore + "</td><td>" + object.data.singleExamClassScores[i].secs3quatrerScore + "</td><td>" + object.data.singleExamClassScores[i].secsHalfScore + "</td><td>" + object.data.singleExamClassScores[i].secsQuarterScore + "</td><td>" + object.data.singleExamClassScores[i].secsMinScore + "</td></tr></table>"
  122. ;
  123. for (var j = 0; j < object.data.singleExamClassYsScores.length; j++) {
  124. if (object.data.singleExamClassYsScores[j].seId == object.data.multiExamStudentScore.singleExamStudentScores[i].seId) {
  125. classText += "<br><br>"
  126. + "单科分层班级名称:" + object.data.singleExamClassYsScores[j].ysClassId + "<br>"
  127. + "单科分数分层班级排名:" + object.data.multiExamStudentScore.singleExamStudentScores[i].essYsClassOrder + "<br>"
  128. + "单科分层班级参考人数:" + object.data.singleExamClassYsScores[j].secsStudentCount + "<br>"
  129. + "单科分层班级年级排名:" + object.data.singleExamClassYsScores[j].secsClassOrder + "<br>"
  130. + "单科分层班级:"
  131. + '<table class="table table-responsive" style="table-layout: fixed;"><tr><td>平均分</td><td>最高分</td><td>四分位数(75%)</td><td>中位数</td><td>四分位数(25%)</td><td>最低分</td></tr>'
  132. + "<tr><td>" + object.data.singleExamClassYsScores[j].secsAvgScore + "</td><td>" + object.data.singleExamClassYsScores[j].secsMaxScore + "</td><td>" + object.data.singleExamClassYsScores[j].secs3quatrerScore + "</td><td>" + object.data.singleExamClassYsScores[j].secsHalfScore + "</td><td>" + object.data.singleExamClassYsScores[j].secsQuarterScore + "</td><td>" + object.data.singleExamClassYsScores[j].secsMinScore + "</td></tr></table>"
  133. ;
  134. }
  135. }
  136. classText += "<br><br>"
  137. + "单科分数年级排名:" + object.data.multiExamStudentScore.singleExamStudentScores[i].essGradeOrder + "<br>"
  138. + "单科年级参考人数:" + object.data.multiExam.singleExams[seIdDic[i]].seStudentCount + "<br>"
  139. + "单科年级:"
  140. + '<table class="table table-responsive" style="table-layout: fixed;"><tr><td>平均分</td><td>最高分</td><td>四分位数(75%)</td><td>中位数</td><td>四分位数(25%)</td><td>最低分</td></tr>'
  141. + "<tr><td>" + object.data.multiExam.singleExams[seIdDic[i]].seAvgScore + "</td><td>" + object.data.multiExam.singleExams[seIdDic[i]].seMaxScore + "</td><td>" + object.data.multiExam.singleExams[seIdDic[i]].se3QuarterScore + "</td><td>" + object.data.multiExam.singleExams[seIdDic[i]].seHalfScore + "</td><td>" + object.data.multiExam.singleExams[seIdDic[i]].seQuarterScore + "</td><td>" + object.data.multiExam.singleExams[seIdDic[i]].seMinScore + "</td></tr></table><br><br>"
  142. ;
  143. }
  144. function sheetOutput(title, dict) {
  145. gradingText += "<h4>" + title + "</h4>"
  146. gradingText += '<table class="table table-responsive" style="table-layout: fixed;"><tr>';
  147. if (dict != ysClassOrder) {
  148. for (var i in dict) {
  149. gradingText += "<td>" + seNameDic[i].substr(0, 2) + "</td>";
  150. }
  151. }
  152. else {
  153. for (var i in dict) {
  154. gradingText += "<td>" + seNameDic[i] + "</td>";
  155. }
  156. }
  157. gradingText += "</tr><tr>"
  158. for (var i in dict) {
  159. gradingText += "<td>" + dict[i] + "</td>";
  160. }
  161. gradingText += "</tr></table><br><br>";
  162. }
  163. } catch (e) {
  164. message.innerHTML += "<br>读取失败!";
  165. output.innerHTML = "";
  166. var charts = document.getElementsByClassName("chart");
  167. for (i = 0; i < charts.length; i++)charts[i].style.display = 'none';
  168. upBtn.classList.remove('btn-danger');
  169. upBtn.classList.add('btn-danger');
  170. upBtn.classList.remove('btn-default');
  171. upIcon.classList.remove('glyphicon-open');
  172. upIcon.classList.remove('glyphicon-exclamation-sign');
  173. upIcon.classList.add('glyphicon-exclamation-sign');
  174. return;
  175. }
  176. // sheetOutput("各科得分比例一览表", scoreRate);
  177. // sheetOutput("各科班级排名一览表", classOrder);
  178. // sheetOutput("各科分层班级排名一览表", ysClassOrder);
  179. // sheetOutput("各科年级排名一览表", gradeOrder);
  180. message.innerHTML += "<br>读取成功!"
  181. output.innerHTML = "<br>注:实验中学 74 桌出品,我略作修改并加上了图表功能<del>,完成作者遗愿</del>。<br><br>"
  182. + "行政班级:" + object.data.examStudents[0].classId + "<br>"
  183. + "姓名:" + object.data.multiExamStudentScore.studentName + "<br>"
  184. + "<br><h4>总分</h4>"
  185. + "全科分数:" + object.data.multiExamStudentScore.messScore + "<br><br>"
  186. + "全科分数班级排名:" + object.data.multiExamStudentScore.messClassOrder + "<br>"
  187. + "全科班级参考人数:" + object.data.multiExamClassScores[0].mecsStudentCount + "<br>"
  188. + "全科班级年级排名:" + object.data.multiExamClassScores[0].mecsClassOrder + "<br>"
  189. + "全科班级:"
  190. + '<table class="table table-responsive" style="table-layout: fixed;"><tr><td>平均分</td><td>最高分</td><td>四分位数(75%)</td><td>中位数</td><td>四分位数(25%)</td><td>最低分</td></tr>'
  191. + "<tr><td>" + object.data.multiExamClassScores[0].mecsAvgScore + "</td><td>" + object.data.multiExamClassScores[0].mecsMaxScore + "</td><td>" + object.data.multiExamClassScores[0].mecs3quatrerScore + "</td><td>" + object.data.multiExamClassScores[0].mecsHalfScore + "</td><td>" + object.data.multiExamClassScores[0].mecsQuarterScore + "</td><td>" + object.data.multiExamClassScores[0].mecsMinScore + "</td></tr></table>"
  192. + "<br><br>全科分数年级排名:" + object.data.multiExamStudentScore.messGradeOrder + "<br>"
  193. + "全科年级参考人数:" + object.data.multiExamSchoolScore.mecsStudentCount + "<br>"
  194. + "全科年级:"
  195. + '<table class="table table-responsive" style="table-layout: fixed;"><tr><td>平均分</td><td>最高分</td><td>四分位数(75%)</td><td>中位数</td><td>四分位数(25%)</td><td>最低分</td></tr>'
  196. + "<tr><td>" + object.data.multiExam.meAvgScore + "</td><td>" + object.data.multiExam.meMaxScore + "</td><td>" + object.data.multiExam.me3QuatrerScore + "</td><td>" + object.data.multiExam.meHalfScore + "</td><td>" + object.data.multiExam.meQuarterScore + "</td><td>" + object.data.multiExam.meMinScore + "</td></tr></table><br><br>"
  197. + classText
  198. + gradingText
  199. + "<h4>汇总</h4>";
  200. $("#fileOutput table").css("display", "inline-table");
  201. $("#fileOutput table").css("margin-bottom", "0px");
  202. // 路径配置
  203. var charts = document.getElementsByClassName("chart");
  204. for (i = 0; i < charts.length; i++)charts[i].style.display = '';
  205. sChart = echarts.init(document.getElementById("score"));
  206. oChart1 = echarts.init(document.getElementById("order1"));
  207. oChart2 = echarts.init(document.getElementById("order2"));
  208. oChart3 = echarts.init(document.getElementById("order3"));
  209. oChart4 = echarts.init(document.getElementById("order4"));
  210. seNameDicP = []; scorePP = []; avgPP = [];
  211. seNameDicP2 = []; classOrderPP = []; gradeOrderPP = []; classOrderQ = []; gradeOrderQ = [];
  212. seNameDicP3 = []; ysClassOrderPP = []; ysClassOrderQ = [];
  213. for (var i in scoreP) {
  214. if (seNameDic[i].substr(0, 2) == '总分') continue;
  215. seNameDicP.push(seNameDic[i].substr(0, 2));
  216. scorePP.push(scoreP[i]);
  217. avgPP.push(avgP[i]);
  218. }
  219. for (var i in classOrderP) {
  220. seNameDicP2.push(seNameDic[i].substr(0, 2));
  221. classOrderPP.push(classOrderP[i]);
  222. gradeOrderPP.push(gradeOrderP[i]);
  223. classOrderQ.push(decimal(classOrder[i] * 100, 1));
  224. gradeOrderQ.push(decimal(gradeOrder[i] * 100, 1));
  225. }
  226. for (var i in ysClassOrderP) {
  227. seNameDicP3.push(seNameDic[i]);
  228. ysClassOrderPP.push(ysClassOrderP[i]);
  229. ysClassOrderQ.push(decimal(ysClassOrder[i] * 100, 1));
  230. }
  231. var sOp = { //具体细节的描述
  232. textStyle: {
  233. fontFamily: 'Noto Serif SC'
  234. },
  235. title: {
  236. text: '成绩与平均分',
  237. textStyle: { //主标题文本样式{"fontSize": 18,"fontWeight": "bolder","color": "#333"}
  238. fontSize: 14,
  239. fontStyle: 'normal',
  240. fontWeight: 'bold',
  241. },
  242. },
  243. tooltip: {
  244. trigger: 'axis'
  245. },
  246. legend: {
  247. data: ['成绩', '平均分']
  248. },
  249. toolbox: { //可以选择具体数据,柱状图,折线图,还原,保存图片的的切换选择
  250. show: true,
  251. feature: {
  252. dataView: {
  253. show: true,
  254. readOnly: false
  255. },
  256. magicType: {
  257. show: true,
  258. type: ['line', 'bar'] //可选折线图和柱状图
  259. },
  260. restore: {
  261. show: true //恢复默认
  262. },
  263. saveAsImage: {
  264. show: true // 存储为图片的功能
  265. }
  266. }
  267. },
  268. calculable: true,
  269. xAxis: [{
  270. type: 'category',
  271. //name: 'min_sup(%)'
  272. data: seNameDicP,
  273. name: '科目',
  274. position: 'left'
  275. }],
  276. yAxis: [{
  277. type: 'value',
  278. name: '分数',
  279. position: 'left'
  280. }],
  281. series: [{
  282. name: '成绩',
  283. type: 'bar',// bar
  284. data: scorePP,
  285. color: '#fb7756'
  286. },
  287. {
  288. name: '平均分',
  289. type: 'bar',//bar
  290. data: avgPP,
  291. color: '#facd60'
  292. }
  293. ]
  294. };
  295. var oOp1 = {
  296. textStyle: {
  297. fontFamily: 'Noto Serif SC'
  298. }, title: {
  299. text: '行政排名位次',
  300. textStyle: { //主标题文本样式{"fontSize": 18,"fontWeight": "bolder","color": "#333"}
  301. fontSize: 14,
  302. fontStyle: 'normal',
  303. fontWeight: 'bold'
  304. },
  305. },
  306. tooltip: {
  307. trigger: 'axis'
  308. },
  309. legend: {
  310. data: ['班级排名', '年级排名']
  311. },
  312. toolbox: {
  313. show: true,
  314. feature: {
  315. dataView: {
  316. show: true,
  317. readOnly: false
  318. },
  319. magicType: {
  320. show: true,
  321. type: ['line', 'bar']
  322. },
  323. restore: {
  324. show: true
  325. },
  326. saveAsImage: {
  327. show: true
  328. }
  329. }
  330. },
  331. calculable: true,
  332. xAxis: [{
  333. type: 'category',
  334. //name: 'min_sup(%)'
  335. data: seNameDicP2,
  336. name: '科目',
  337. position: 'left'
  338. }],
  339. yAxis: [{
  340. type: 'value',
  341. name: '排名',
  342. position: 'left'
  343. }],
  344. series: [{
  345. name: '班级排名',
  346. type: 'bar',
  347. data: classOrderPP,
  348. color: '#343090'
  349. }, {
  350. name: '年级排名',
  351. type: 'bar',
  352. data: gradeOrderPP,
  353. color: '#5f59f7'
  354. }
  355. ]
  356. };
  357. var oOp2 = {
  358. textStyle: {
  359. fontFamily: 'Noto Serif SC'
  360. }, title: {
  361. text: '行政排名比例',
  362. textStyle: { //主标题文本样式{"fontSize": 18,"fontWeight": "bolder","color": "#333"}
  363. fontSize: 14,
  364. fontStyle: 'normal',
  365. fontWeight: 'bold'
  366. },
  367. },
  368. tooltip: {
  369. trigger: 'axis'
  370. },
  371. legend: {
  372. data: ['班级排名(%)', '年级排名(%)']
  373. },
  374. toolbox: {
  375. show: true,
  376. feature: {
  377. dataView: {
  378. show: true,
  379. readOnly: false
  380. },
  381. magicType: {
  382. show: true,
  383. type: ['line', 'bar']
  384. },
  385. restore: {
  386. show: true
  387. },
  388. saveAsImage: {
  389. show: true
  390. }
  391. }
  392. },
  393. calculable: true,
  394. xAxis: [{
  395. type: 'category',
  396. //name: 'min_sup(%)'
  397. data: seNameDicP2,
  398. name: '科目',
  399. position: 'left'
  400. }],
  401. yAxis: [{
  402. type: 'value',
  403. name: '排名(%)',
  404. position: 'left'
  405. }],
  406. series: [{
  407. name: '班级排名(%)',
  408. type: 'bar',
  409. data: classOrderQ,
  410. color: '#343090'
  411. }, {
  412. name: '年级排名(%)',
  413. type: 'bar',
  414. data: gradeOrderQ,
  415. color: '#5f59f7'
  416. }
  417. ]
  418. };
  419. var oOp3 = {
  420. textStyle: {
  421. fontFamily: 'Noto Serif SC'
  422. }, title: {
  423. text: '分班排名位次',
  424. textStyle: { //主标题文本样式{"fontSize": 18,"fontWeight": "bolder","color": "#333"}
  425. fontSize: 14,
  426. fontStyle: 'normal',
  427. fontWeight: 'bold'
  428. },
  429. },
  430. tooltip: {
  431. trigger: 'axis'
  432. },
  433. legend: {
  434. data: ['分班排名']
  435. },
  436. toolbox: {
  437. show: true,
  438. feature: {
  439. dataView: {
  440. show: true,
  441. readOnly: false
  442. },
  443. magicType: {
  444. show: true,
  445. type: ['line', 'bar']
  446. },
  447. restore: {
  448. show: true
  449. },
  450. saveAsImage: {
  451. show: true
  452. }
  453. }
  454. },
  455. calculable: true,
  456. xAxis: [{
  457. type: 'category',
  458. //name: 'min_sup(%)'
  459. data: seNameDicP3,
  460. name: '科目',
  461. position: 'left'
  462. }],
  463. yAxis: [{
  464. type: 'value',
  465. name: '排名',
  466. position: 'left'
  467. }],
  468. series: [{
  469. name: '分班排名',
  470. type: 'bar',
  471. data: ysClassOrderPP,
  472. color: '#44c2fd'
  473. }
  474. ]
  475. };
  476. var oOp4 = {
  477. textStyle: {
  478. fontFamily: 'Noto Serif SC'
  479. }, title: {
  480. text: '分班排名比例',
  481. textStyle: { //主标题文本样式{"fontSize": 18,"fontWeight": "bolder","color": "#333"}
  482. fontSize: 14,
  483. fontStyle: 'normal',
  484. fontWeight: 'bold'
  485. },
  486. },
  487. tooltip: {
  488. trigger: 'axis'
  489. },
  490. legend: {
  491. data: ['分班排名(%)']
  492. },
  493. toolbox: {
  494. show: true,
  495. feature: {
  496. dataView: {
  497. show: true,
  498. readOnly: false
  499. },
  500. magicType: {
  501. show: true,
  502. type: ['line', 'bar']
  503. },
  504. restore: {
  505. show: true
  506. },
  507. saveAsImage: {
  508. show: true
  509. }
  510. }
  511. },
  512. calculable: true,
  513. xAxis: [{
  514. type: 'category',
  515. //name: 'min_sup(%)'
  516. data: seNameDicP3,
  517. name: '科目',
  518. position: 'left'
  519. }],
  520. yAxis: [{
  521. type: 'value',
  522. name: '排名(%)',
  523. position: 'left'
  524. }],
  525. series: [{
  526. name: '分班排名(%)',
  527. type: 'bar',
  528. data: ysClassOrderQ,
  529. color: '#44c2fd'
  530. }
  531. ]
  532. };
  533. // 为echarts对象加载数据
  534. sChart.setOption(sOp);
  535. oChart1.setOption(oOp1);
  536. oChart2.setOption(oOp2);
  537. oChart3.setOption(oOp3);
  538. oChart4.setOption(oOp4);
  539. }
  540. reader.readAsText(file);
  541. }
  542. </script>
  543. <title>
  544. 实验中学成绩整理
  545. </title>
  546. </head>
  547. <body>
  548. <a class="btn btn-info" href="/" style="text-shadow: rgb(85, 85, 85) 3px 2px 4px;"><span
  549. class="glyphicon glyphicon-home" aria-hidden="true"></span>&nbsp;返回</a>
  550. <div>
  551. <h1>
  552. 实验中学成绩整理
  553. </h1>
  554. <p style="font-size:16px">基于心意答查分页面提供的数据整理汇总考试成绩</p>
  555. <h2>如何获取数据</h2>
  556. <p>尽量使用 Google Chrome 浏览器,不保证其他浏览器操作相同。</p>
  557. <p>1. 进入心意答查分页面;</p>
  558. <p>2. 按下 F12 打开控制台,若无反应,尝试 Fn+F12;</p>
  559. <p>3. 控制台顶栏分页中找到“<b>网络</b>”或“<b>Network</b>”(可能需要从下拉框里面找);</p>
  560. <p>4. 刷新页面(用 F5 刷新),此时应看到控制台中出现一批文件,点击其中的“<b>getStudentReportMEVO</b>”;</p>
  561. <p>5. 在新出现的小页面的顶栏分页中找到“<b>预览</b>”或“<b>Preview</b>”;</p>
  562. <p>6. 此时应看到“{data: {,...”等数据,一定在数据第一行右键(或在其最后一行下方空白处右键),随后“<b>复制物体</b>”或“<b>Copy Object</b>”;</p>
  563. <p>7. 新建文本文档(格式为 txt,不可用 Word 文档),将所复制的内容粘贴并保存,于下方按钮打开。</p>
  564. <p style="font-size: 12px;font-style: italic;">
  565. 注:图表整理均在本地进行,你的数据不会上传到网络。<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;你获取的数据在心意答上未经加密并可直接访问,本质上对学生都是公开的,但恶意使用这些数据造成的后果自负。
  566. </p>
  567. </div>
  568. <div style="text-align: center;">
  569. <a tabindex="0" class="btn btn-default" href="tutor/"
  570. style="text-shadow: rgb(185, 185, 185) 3px 2px 4px;display:inline-block;">
  571. <span class="glyphicon glyphicon-question-sign" aria-hidden="true"></span>&nbsp;<b>查看示例截图</b>
  572. </a>
  573. <a id="upbtn" tabindex="0" class="btn btn-info" onclick="document.getElementById('fileInput').click();"
  574. style="text-shadow: rgb(85, 85, 85) 3px 2px 4px;display:inline-block;">
  575. <span id="upicon" class="glyphicon glyphicon-open" aria-hidden="true"></span> <b>打开文件</b><input
  576. style="display: none;" id="fileInput" type="file" onchange="processFiles(event)">
  577. </a>
  578. </div>
  579. <div id="message"></div>
  580. <div id="fileOutput"></div>
  581. <div id="score" class="chart" style="display: none"></div>
  582. <div id="order1" class="chart" style="display: none"></div>
  583. <div id="order2" class="chart" style="display: none"></div>
  584. <div id="order3" class="chart" style="display: none"></div>
  585. <div id="order4" class="chart" style="display: none"></div>
  586. </body>