首页 > 代码库 > 毕业设计总结（1）-canvas画图

毕业设计总结（1）-canvas画图

2024-07-24 00:12:29   218人阅读

　　去年6月底完成的毕业设计，到现在也才开始给它做个总结，里面有很多可以学习和借鉴的东西。

　　我的毕业设计的题目是“一种路径规划算法的改进与设计”，具体的要求可参见下面的表格：

题目

一种路径规划算法的改进与设计

类型

毕业设计

性质

工程设计

来源

结合科研

限选人数

1

已选人数

1

毕业设计的任务和要求

在一个布满障碍物的地图上，过凸极值点划分区域；在相应的区域中抽象出一个点来对应各区域，画出连通无向图；根据对应的权值找出最优路径；写出相应的算法。

毕业设计的具体工作内容

1．学习课题相关理论知识，进行必要的调研和查阅相关的资料，撰写毕业设计开题报告；
2．对课题进行需求分析，撰写需求分析说明书；然后进行系统设计，书写系统设计说明书，完成所规定的内容：
      （1）拟合曲线模拟障碍物；
      （2）过凸极值点做水平切线划分区域；
      （3）区域存储；
      （4）构造无向图；  
   （5）设定权值，确定最优路径；
      （6）证明此算法的有效性。
3．完成系统的设计；
4．完成系统测试工作；
5．翻译计算机相关外文文献；
6．撰写毕业设计说明书。

对毕业设计成果的要求

开题报告一份，任务书一份，毕业设计说明书一份，软件一套，3000字外文翻译一份。

备注

 

已选学生

 

 　　我总结的内容差不多也是按照按照需求里的步骤进行的，首先进行的是canvas画图。

　　canvas是在html5里添加的新元素，利用该元素能够在网页上进行画图。当然，canvas元素本身没有画图能力，所有的绘制工作必须在 JavaScript 内部完成，画布是一个矩形区域，您可以控制其每一像素。

　　

　　1. 创建

　　使用前，我们首先要新建一个canvas的元素

<canvas id="screen" width="800" height="600">骚瑞，您的浏览器不支持canvas</canvas>

　　如果您的浏览器不支持html5的canvas，那么浏览器上就会出现“骚瑞，您的浏览器不支持canvas”的字样，您就需要升级或更换浏览器了。

　　画布创建好以后，我们还需要一支笔：

var screen  = document.getElementById("screen");var context = screen.getContext("2d");

　　getContext方法指定参数2d，表示该canvas对象用于生成2D图案（即平面图案）。如果参数是3d，就表示用于生成3D图像（即立体图案），这部分实际上单独叫做WebGL API

　　2. 绘制图形

　　

毕业设计总结（1）-canvas画图


联系
我们