DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> HTML基礎知識 >> HTML5教程 >> html5使用canvas畫一條線
html5使用canvas畫一條線
編輯:HTML5教程     

   代碼太簡單了,就不廢話了

  代碼如下:

  var canvas=document.getElementById("canvas");

  //設置繪圖環境

  var cxt=canvas.getContext('2d');

  //開啟新路近

  cxt.beginPath();

  // 設置筆觸的寬度

  cxt.lineWidth=10;

  //設置筆觸的顏色

  cxt.strokeStyle="#00ff00";

  //設定筆觸的位置

  cxt.moveTo(20,20);

  //設置移動的位置

  cxt.lineTo(100,20);

  //畫線

  cxt.stroke();//這個時候的線已經出來了

  //關閉路徑

  cxt.closePath();

  //凡事路徑圖形必須先開始路徑,畫完之後必須結束路徑

html5使用canvas畫一條線
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved