2020软工结对第二次作业

一、作业概述

| 这个作业属于哪个课程 | 软件工程2020秋学期 |
| ---- | ---- | --- |
| 这个作业的要求在哪 | https://edu.cnblogs.com/campus/fzu/SE2020/homework/11277 |
| GitHub仓库地址 | https://github.com/xihuyouyong/031802427- |
| 结对同学博客链接 |https://www.cnblogs.com/htx1/ |

二、PSP表格

PSP2.1 Personal Software Process Stages 预估耗时(分钟) 实际耗时(分钟)
Planning 计划 60 60
Estimate 估计这个任务需要多少时间 10 10
Development 开发 500 540
Analysis 需求分析 (包括学习新技术) 480 500
Design Spec 生成设计文档 60 60
Design Review 设计复审 (和同事审核设计文档) 30 20
Coding Standard 代码规范 (为目前的开发制定合适的规范 20 20
Design 具体设计 120 90
Coding 具体编码 420 400
Code Review 代码复审 30 30
Test 测试( 自我测试,修改代码,提交修改) 30 40
Reporting 报告 60 60
Test Report 测试报告 20 30
Size Measurement 计算工作量 20 30
Postmortem & Process Improvement Plan 事后总结, 并提出过程改进计划 60 60
合计 1920 1950

三、解题思路描述与设计实现说明

看到题目之后了解到大致思路如下:
1.如何输入正确的文本格式及传送过去
2.在web界面生成动态树形结构
3.该树形结构应该可缩放
经过查询了解后,发现使用D3.JS——数据可视化的JSON来比较好解决本次的问题。

但是短时间掌握这个插件确实不现实

主要后来找到了契合这次动态生成树实现的例子。
https://blog.csdn.net/joker_fei/article/details/76910023
简直美滋滋

大致流程图

有用的代码

 function chase() 
    {
        var count = 0; //定义儿子节点的编号
        var flag = 0; //定义标志是否为关联树值为1
        var all_data = document.getElementById("user").value;
        var sclice_data = [];
        var model_data = [];
        var skill_data = [];
        var sk_data = [];
        var sk_num = 0;
        var daoshi_num = 0;
        model_data = all_data.split("\n\n");

// document.write(model_data);
for(var x = 0; x < model_data.length; x++)
{
// document.write(model_data.length);
// document.write(x);
sclice_data = model_data[x].split("\n");
// document.write(sclice_data);
if (sclice_data.length == 1 )
{
// document.write("ok");
var hb = sclice_data[0].split(":");
var head_tmp = hb[0];
var body_tmp = hb[1];
// document.write(head_tmp);
if(head_tmp != "导师")
{
// document.write("557");
// document.write(body_tmp);
sk_data = body_tmp.split("、");
// document.write(sk_data);
var ct = 0;
skill_data[sk_num] = new Array();
skill_data[sk_num][ct++] = head_tmp;
// document.write(sk_num);
// document.write(skill_data[sk_num][0]);
for(var n = 0; n < sk_data.length; n++)
{
skill_data[sk_num][ct++] = sk_data[n];
}
// document.write(skill_data[sk_num]);
sk_num += 1;
// document.write(sk_num);
}
else{
daoshi_num += 1;
}
}
else if(sclice_data[0].split(":")[0] == "导师")
{
daoshi_num++;
}
// document.write(sclice_data[0].split(":")[0]);
// document.write(daoshi_num);
}

详见流程图

四、附加特点设计与展示

没有什么特别的地方,都是前人用过的东西

五、在博客中给出目录说明和使用说明

1.目录组织

2、使用说明

下载树2.0.rar到本地,解压后文件本地,用chrome打开index.html,在右侧文本框输入文本。
学术家族树以文本形式输入,点击提交文本框。

六、GitHub代码commit

七、遇到的代码模块异常或结对困难及解决方法

尝试过vue.js与d3.js的结合,以及尝试jquery的结合
产生新的块,在新的块中生成新的学术家族树
...失败,像是在自找麻烦

posted @ 2020-10-12 13:29  xihuyouyong  阅读(118)  评论(0编辑  收藏  举报