canvas 绘制箭头

绘制向右箭头：

<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script type="text/ecmascript">
function draw(){
    
    var canvas=document.getElementById("test");
    if(canvas.getContext){
        
        var ctx=canvas.getContext("2d");
            ctx.beginPath();                           //创建一个路径在内存里，构成一个图形，每次调用beginPath()，路径重置，绘制新图形
            ctx.moveTo(50,50);             //轨迹移动的起始位置
            ctx.lineTo(50,100);             //轨迹移动第一个位置坐标
            ctx.lineTo(75,75);                //轨迹移动第二个位置坐标
            ctx.fill();                            //填充一个实心图形   默认黑色
        };
    };
</script>
</head>

<body onLoad="draw();">
<canvas id="test" width="150" height="150"></canvas>
</body>

posted on 2013-12-14 17:56 熏风阅读(1261) 评论(0) 编辑收藏举报