Html5_convas
var elem = document.getElementById("myConvas");
if (elem && elem.getContext) {
var myContext = elem.getContext("2d");
/*
通过 fillStyle和 strokeStyle 属性可以轻松的设置矩形的填充和线条。
颜色值使用方法和 CSS 一样:十六进制数、rgb()、rgba() 和 hsla。
通过 fillRect可以绘制带填充的矩形。使用 strokeRect 可以绘制只有边框没有填充的矩形。
如果想清除部分 canvas 可以使用 clearRect。上述三个方法的参数相同:x, y, width, height。
前两个参数设定 (x,y) 坐标,后两个参数设置矩形的高度和宽度。可以使用 lineWidth属性改变线条粗细
*/
myContext.fillStyle = "#000FFF";
myContext.strokeStyle = "#FF00F0";
/*
通过 canvas 路径(path)可以绘制任意形状。可以先绘制轮廓,然后绘制边框和填充。
创建自定义形状很简单,使用 beginPath()开始绘制,然后使用直线、曲线和其他图形绘制你的图形。
绘制完毕后调用 fill 和 stroke 即可添加填充或者设置边框。调用 closePath() 结束自定义图形绘制
*/
myContext.beginPath();
myContext.moveTo(10,10);
//定义第一条直线的终点坐标,也即为第二条直线的起点坐标
myContext.lineTo(60,90);
myContext.lineTo(10,150);
myContext.lineTo(10,10);
//画圆
//myContext.arc(90,89,45,50,Math.PI*2,true);
//用fillStyle定义的颜色填充
myContext.fill();
myContext.stroke();
myContext.closePath();
}