1. 程式人生 > >Canvas在頁面畫出各種圖形的方法

Canvas在頁面畫出各種圖形的方法

以三角形作為案例:

  <canvas id="uitooltip" height="5px" width="5px"></canvas> //html中的標籤;

//定義canvas的大小;可以是正方形和長方形;

       window.tooltip = function(){

//定義全域性函式;

            var uitooltip= document.getElementById("uitooltip");  
            var context = uitooltip.getContext("2d");
            context.strokeStyle = "white";   
            context.fillStyle = "white";

            context.lineWidth = 1;  

            context.moveTo(2.5,0);  
            context.lineTo(0,5);  

            context.lineTo(5,5);  

//定義三角形大小;

            context.closePath();
            context.fill();

            context.stroke(); 

//呼叫方法;

    }