html5 javascript canvas API 画线,画对角线
来源:互联网 发布:cms程序 编辑:程序博客网 时间:2024/06/06 01:04
html5 javascript canvas API 画线,画对角线
<!DOCTYPE html><html><title>html5 javascript canvas API 画线,画对角线</title><body><canvas id="diagonal" style="border:1px solid;" width="200" height="200"></canvas> <canvas id="diagonal_line" style="border:1px solid;" width="200" height="200"></canvas> <canvas id="diagonal_x" style="border:1px solid;" width="200" height="200"></canvas> <br>//带实心边框的canvas元素 <script> function drawDiagonalLine() { var canvas=document.getElementById('diagonal_line'); //获取canvas对象 var context=canvas.getContext('2d'); //获取canvas的上下文 context.beginPath(); context.moveTo(0,0); context.lineTo(140,70); context.stroke(); } drawDiagonalLine(); //画X线 function drawX() { var canvas=document.getElementById('diagonal_x'); var context=canvas.getContext('2d'); context.beginPath(); //draw \ context.moveTo(0,0); context.lineTo(200,200); //draw / context.moveTo(0,200); context.lineTo(200,0); context.stroke(); } drawX(); //画translate重定义坐标原点 function drawTranslate() { var canvas=document.getElementById('diagonal_translate'); var context=canvas.getContext('2d'); context.save(); context.translate(70,140); context.beginPath(); context.moveTo(0,0); context.lineTo(70,-70); context.stroke(); context.resore(); } //drawTranslate(); window.addEventListener("load",drawTranslate,true);</script><canvas id="diagonal_translate" style="border:1px solid;" width="200" height="200"></canvas></body></html>
- html5 javascript canvas API 画线,画对角线
- html5 使用canvas画线
- 【html5每日练习】html5 canvas画线
- Html5系列(十七) canvas 对角线渐变
- Html5 Canvas画线有毛边解决方法
- HTML5中Canvas画线技巧大全
- HTml5 Canvas 整理笔记之画线
- javascript html5 画线 写文字
- Canvas---HTML5 Canvas API详解
- html5 学习笔记 API canvas1 绘制对角线
- html5 学习笔记 API canvas1 绘制对角线
- canvas画线API实现简单地图
- HTML5: Canvas API
- HTML5:canvas API
- HTML5程序设计 Canvas API
- HTML5 Canvas API详解
- HTML5 Canvas绘图API
- html5中Canvas API
- 完全备份、差异备份和增量备份的权威解释!!!
- WTL快速之旅
- Spring3.x 整合hibernate 实现数据保存
- PB获取服务器时间
- PB判断是否有重复数据
- html5 javascript canvas API 画线,画对角线
- Oracle EBS默认的账户
- LCA算法
- javascript验证正则表达式
- YUV格式介绍
- 46.如何创建、编译和执行同一个包内的多个文件
- #define 中 # 和 ## 的作用
- 近期的安全事件
- 函数调用方式 FAR PASCAL,__cdecl,_stdcall,__pasc