兄弟连PHP视频教程-canvas实例3-在线画图工具-画线和属性设定课件.pptxVIP

Canvas实例3-在线画图板 主讲：丛浩 @LAMP兄弟连丛浩 conghao@lampbrother.net 本章概要 画图板功能分析。 画图板技术分析。 绘制页面、美化页面 编辑功能。先画一个简单的画图板分析思路，然后应用到项目中。 预览图 画图板功能分析 功能区(保存、清空) 工具区(形状和工具) 属性设置区(颜色和线宽) 绘图区域(canvas标签) 技术需求分析 页面布局-HTML5标签 页面美化-CSS2 功能设置-Javascript编程 Canvas API-属性设置、画线、写字、画图、画布操作(清空、获取画布信息)、 下载-php的下载(JS无法操作本地文件) 画一个简单的画布 鼠标点击时 准备起始点 moveTo()、设置标志位 鼠标移动时 判断标志位，值为true画图，false不画图 移动时指定路径lineTo()，并且画出来stroke() 鼠标离开或者抬起 清空标志位 复杂的在线画板 获取相应元素对象 设置点击状态 设置触发功能 颜色属性设置 线宽属性设置 绘图形状设置 工具指定 课程结束