[js高手之路] html5 canvas系列教程 - 開始路徑beginPath與關閉路徑closePath詳解
。為什么呢？ 首先我們要搞清楚canvas渲染圖形，它是基於狀態的，所謂狀態就是每一次用( stroke/fill )之類的 ...
原文：[js高手之路] html5 canvas系列教程 - 狀態詳解(save與restore)
本文內容與路徑 js高手之路 html canvas系列教程 開始路徑beginPath與關閉路徑closePath詳解 是canvas中比較重要的概念。掌握理解他們是做出復雜canvas動畫必要的基礎之一. 再談clip函數，這個函數在這篇文章 js高手之路 html canvas系列教程 圖片操作 drawImage,clip,createPattern 已經有講到過他的基本用法，我們來兩個簡 ...
2017-09-27 15:51 0 2812 推薦指數：
相關推薦
[js高手之路] html5 canvas系列教程 - 認識canvas以及基本使用方法
canvas是html5中引入的一個新元素，俗稱畫布，既然是畫布，當然是用來畫圖的。canvas技術指的是利用javascript操作canvas元素繪制圖形的技術，要使用canvas,一定要瀏覽器支持canvas，谷歌和火狐的支持性很好，IE8不支持。你可以參考這個網站，查看canvas的支持性 ...
[js高手之路] html5 canvas系列教程 - 掌握畫直線圖形的常用API
我們接着上文[js高手之路] html5 canvas系列教程 - 認識canvas以及基本使用方法繼續. 一、直線的繪制 cxt.moveTo( x1, y1 )： 將畫筆移動到x1, y1這個點 cxt.lineTo( x2, y2 )：將畫筆從起點開始畫直線，一直畫到終點坐標( x2 ...
[js高手之路] html5 canvas系列教程 - 線條樣式(lineWidth,lineCap,lineJoin,setLineDash)
上文，寫完弧度與貝塞爾曲線[js高手之路] html5 canvas系列教程 - arcTo(弧度與二次,三次貝塞爾曲線以及在線工具)，本文主要是關於線條的樣式設置 lineWidth: 設置線條的寬度，值是一個數值，如lineWidth = 5. 畫3條不同寬度的線條 ...
[js高手之路] html5 canvas系列教程 - 線形漸變,徑向漸變與陰影設置
接着上文[js高手之路] html5 canvas系列教程 - 像素操作(反色,黑白,亮度,復古,蒙版,透明)繼續. 一、線形漸變 線形漸變指的是一條直線上發生的漸變。 用法： var linear = cxt.createLinearGradient( x1, y1, x2, y2 ...
[js高手之路] html5 canvas系列教程 - 圖片操作(drawImage,clip,createPattern)
接着上文[js高手之路] html5 canvas系列教程 - 文本樣式(strokeText,fillText,measureText,textAlign,textBaseline)繼續，本文介紹的內容是canvas開發，特別是游戲中，比較常用的內容：圖片處理。在游戲中的資源大多數都是加載圖片 ...
[js高手之路] html5 canvas系列教程 - arc繪制曲線圖形(曲線，弧線，圓形)
繪制曲線，經常會用到路徑的知識，如果你對路徑有疑問，可以參考我的這篇文章[js高手之路] html5 canvas系列教程 - 開始路徑beginPath與關閉路徑closePath詳解. arc：畫弧度 cxt.arc( x, y, 半徑, 開始角度，結束角度，是否逆時針 ); x, y ...
[js高手之路] html5 canvas系列教程 - 像素操作(反色,黑白,亮度,復古,蒙版,透明)
接着上文[js高手之路] html5 canvas系列教程 - 狀態詳解(save與restore)，相信大家都應該玩過美顏功能，而我們今天要講的就是canvas強大的像素處理能力，通過像素處理，實現反色，黑白，亮度，復古，蒙版，透明等美顏效果. getImageData：獲取一張圖片的像素數 ...