软件工程实践2019第五次作业
part1
作业内容:https://edu.cnblogs.com/campus/fzu/2019FZUSEZ/homework/8736
github项目地址:https://github.com/Hyperion233a/031702344-
博客作业地址:https://www.cnblogs.com/sz1936/p/11705363.html
##part2 psp表格
PSP2.1 | Personal Software Process Stages | 预估耗时(分钟) | 实际耗时(分钟) |
---|---|---|---|
Planning | 计划 | 120 | 130 |
Estimate | 估计这个任务需要多少时间 | 120 | 130 |
Development | 开发 | 600 | 620 |
Analysis | 需求分析 (包括学习新技术) | 800 | 900 |
Design Spec | 生成设计文档 | 60 | 45 |
Design Review | 设计复审 | 60 | 50 |
Coding Standard | 代码规范 (为目前的开发制定合适的规范) | 30 | 40 |
Design | 具体设计 | 60 | 60 |
Coding | 具体编码 | 600 | 820 |
Code Review | 代码复审 | 60 | 65 |
Test | 测试(自我测试,修改代码,提交修改) | 180 | 270 |
Reporting | 报告 | 120 | 100 |
Test Repor | 测试报告 | 120 | 110 |
Size Measurement | 计算工作量 | 30 | 35 |
Postmortem & Process Improvement Plan | 事后总结, 并提出过程改进计划 | 60 | 70 |
合计 | 2900 | 3185 |
part3
解题思路描述与设计实现说明
实现流程图如下:
代码如下:
调用getvalue函数,从文本框读取数据,再用split对数据分行,循环找出为空的行并返回,这样就找到一组数据,再分别对每组数据进行处理就能实行多棵树并存。数据处理就是把数据处理成有层次性的数据,以便使用echart生成树。
``` function getvalue(){
var treedata=Array();
var i,j,k,l=0;
var str=$("#input").val(); //获取输入
var arrstr=Array();
arrstr=str.split("\n");//数据分行
for(i=0;i<arrstr.length;)
{
for(j=i+1;j<arrstr.length;j++)
{
if(arrstr[j]=='')
{
break;
}
} //此时i~j-1为一组数据
var doctor=[],master=[],bachelor=[]; //存放学生数据
for(k=i;k<j;k++)
{
var d=0,m=0,b=0;
if(k==i)
{
treedata.push({"name":"",
"children":[{"name":"博士生",
"children":[]},{"name":"硕士生","children":[]},
{"name":"本科生","children":[]}]
});
}
var item=arrstr[k].split(':');
if(item[0].includes("导师")){
treedata[l]["name"]=item[1];
}
else if(arrstr[k].includes("博士生")){
for(d=0;d<doctor.length;d++){
if(arrstr[k].slice(0,5)==doctor[d]["name"]){
var student=item[1];
var students=item[1].split("、");//存放每个学生姓名
for(var x=0;x<students.length;x++){
var studentName=students[x];
student={"name":studentName,"children":[]};
doctor[d]["children"].push(student);
}
break;
}
}
if(d==doctor.length){
var student={"name":arrstr[k].slice(0,5),"children":[]};
doctor.push(student);
student=item[1].split("、");
for(var x=0;x<student.length;x++){
var s={"name":student[x],"children":[]};
doctor[d]["children"].push(s);
}
}
}
else if(item[0].includes("硕士生")){
for(d=0;d<master.length;d++){
if(arrstr[k].slice(0,5)==master[d]["name"]){
var student=item[1];
var students=item[1].split("、");//存放每个学生姓名
for(var x=0;x<students.length;x++){
var studentName=students[x];
student={"name":studentName,"children":[]};
master[d]["children"].push(student);
}
break;
}
}
if(d==master.length){
var student={"name":arrstr[k].slice(0,5),"children":[]};
master.push(student);
student=item[1].split("、");
for(var x=0;x<student.length;x++){
var s={"name":student[x],"children":[]};
master[d]["children"].push(s);
}
}
}
else{
for(d=0;d<bachelor.length;d++){
if(arrstr[k].slice(0,5)==bachelor[d]["name"]){
var student=item[1];
var students=item[1].split("、");//存放每个学生姓名
for(var x=0;x<students.length;x++){
var studentName=students[x];
student={"name":studentName,"children":[]};
bachelor[d]["children"].push(student);
}
break;
}
}
if(d==bachelor.length){
var student={"name":arrstr[k].slice(0,5),"children":[]};
bachelor.push(student);
student=item[1].split("、");
for(var x=0;x<student.length;x++){
var s={"name":student[x],"children":[]};
bachelor[d]["children"].push(s);
}
}
}
}
treedata[l]["children"][0]["children"]=doctor;
treedata[l]["children"][1]["children"]=master;
treedata[l]["children"][2]["children"]=bachelor;
l=l+1;
i=j+1;
}
for(i=0;i<treedata.length;i++)
{
var data=[];
data[0]=treedata[i];
var x=i.toString();
$("body").append("<div id='x' style=\"width:100px0;height:900px;\"></div>");
$("#x").attr('id',x);
data[0]=treedata[i];
drawTree(data,x);
}
}
```
drawTree函数是在csdn上找的用echart构建树的函数
function drawTree(treedata,x) { var myChart = echarts.init(document.getElementById(x));//div元素节点的对象 myChart.setOption({ tooltip : { trigger : 'item', triggerOn : 'none' }, series : [ { type : 'tree', name : 'TREE_ECHARTS', data : treedata, top : '2%', left : '10%', bottom : '30%', right : '15%', symbolSize : 20, label : { normal : { position : 'left', verticalAlign : 'middle', align : 'right', fontSize: 30, color:"black" } }, leaves : { label : { position : 'right', verticalAlign : 'middle', align : 'left' } }, expandAndCollapse : true , initialTreeDepth : 10 //展示层级数 } ] });
part4
附加特点设计与展示
part5
目录说明和使用说明
part6
遇到的代码模块异常及解决方法
之前完全没接触过网页的开发,所以花了很长时间来学习有关网页的设计。在处理数据时,没有把数据整理成层次性的,一直生成不了树,在同学的帮助下,学习了echart构建树,总算完成了任务。