平面设计程设计报告.docVIP

 PAGE 17 计算机科学与技术学院课程设计成绩单 课程名称：平面设计课程设计 指导教师： 姓名性别学号班级综合成绩成绩等级 设计整体表现力 （占总成绩20%） □能正确表现 □基本能正确表现 □能表现但不完善 （20分） （15分） （10分） 设计功能完善程度 （占总成绩10%） □完善 □基本完善 □不完善 （10分） （8分） （5分） 设计结构的合理性 （占总成绩10%） □合理 □基本合理 □不太合理 （10分） （8分） （5分） 对问题的答辩情况 （占总成绩30%）□概念正确有创新 □能正确回答所有问题 □基本能正确回答 （30分） （25分） （20分） □部分问题回答概念不清晰 （10分） 学生的工作态度与独立工作能力 （占总成绩10%） □工作态度认真能独立完成任务 □工作态度认真但独立性较差 （10分） （8分） □工作态度基本认真但缺乏独立性 （5分） 设计报告的规范性 （占总成绩20%） □符合规范 □基本符合规范 □规范性较差 （20分） （15分） （10分）优秀：90分~100分 良好：80分~89分 中等：70~79分 及格：60~69分 不及格0分~59分 武汉科技大学计算机科学与技术学院制表 计算机科学与技术学院 课 程 设 计 报 告 课程名称： 平面设计课程设计 专 业： 计算机应用技术 班 级： 学 号： 姓 名： 指导老师： 二〇一 二年十 二月28日 题目 Web五子棋 设计思想 利用html5，javascript制作棋盘，棋盘对应一个二维数组，五子棋棋盘落子点对应的二维数组元素。数组的元素对应落子点。比如数组元素值为0表示该元素对应的落子点没有棋子，数组元素值为1表示该元素对应的落子点有白棋子，数组元素值为2表示该元素对应的落子点有黑棋子; 　　 判断五子棋赢棋的算法是通过对五子棋棋盘落子点对应的二维数组的操作来实现的。 　　 判断五子棋赢棋算法：函数可以实现判断五子棋赢棋的算法，其中函数的参数xx.yy为数组下标，chess数组实现五子棋棋盘落子点的数据结构映射。 　　 算法的思想方法是：以当前落子点对应的下标为基点，向其周围8个方向进行搜索，如果有同色子连五子，返回1，或2，否则返回0。返回1代表白棋方胜，返回2代表黑棋方胜。返回0代表没有发生赢棋数据结构状态。 程序用到的棋子 应用主要技术说明 html5和javascript，制作网页元素实现页面呈现，数据结构算法实现输赢判断。 制作过程 准备棋子素材 到网上下载五子棋黑白棋子图片，用ps处理图片，背景透明，像素36*36.黑棋图片命名为b，白棋命名为w。 利用DWcs6制作html网页，编写代码。 画棋盘函数： function drawRect() {//画棋盘 canvas = document.getElementById(canvas); context = canvas.getContext(2d); for (var i = 0; i = 640; i += 40) {//绘制棋盘的线 context.beginPath(); context.moveTo(0, i); context.lineTo(640, i); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(i, 0);