SVG與HTML5的canvas各有什么優(yōu)點(diǎn)，哪個(gè)更有前途？SVG通常用于繪制圖標(biāo)和圓形框架。畫(huà)布是兩種不同類型的繪畫(huà)。在靜態(tài)繪圖、圖標(biāo)尺測(cè)量繪圖等方面都無(wú)法與SVG相比。Canvas可以繪制三維粒子

SVG與HTML5的canvas各有什么優(yōu)點(diǎn)，哪個(gè)更有前途？

SVG通常用于繪制圖標(biāo)和圓形框架。畫(huà)布是兩種不同類型的繪畫(huà)。在靜態(tài)繪圖、圖標(biāo)尺測(cè)量繪圖等方面都無(wú)法與SVG相比。Canvas可以繪制三維粒子動(dòng)畫(huà)游戲。如果它真的想和Canvas相比，它更好，因?yàn)镾VG的東西可以做。如果SVG的東西將來(lái)做不到，最好還是學(xué)SVG。當(dāng)然不難學(xué)，帆布更有前途。畢竟，canvas相當(dāng)于一個(gè)系統(tǒng)

SVG是一個(gè)矢量圖，而canvas不是。然而，SVG使用HTML語(yǔ)法來(lái)描述圖形。他們都使用javscript來(lái)繪制和操作圖形。如果在實(shí)際應(yīng)用中圖形變化頻繁，對(duì)圖形清晰度的要求不是很高，可以考慮使用畫(huà)布，比如網(wǎng)頁(yè)上的小游戲或者一些很酷的特效。另外SVG也很好，圖像質(zhì)量也很高很好，比如各種統(tǒng)計(jì)圖形、矢量圖標(biāo)、字體圖標(biāo)等等！而且他們都有一個(gè)很好的類庫(kù)可以使用，或者更好

SVG與HTML5的canvas各有什么優(yōu)點(diǎn)，哪個(gè)更有前途？

區(qū)別一：SVG繪制的每個(gè)圖形的元素都是獨(dú)立的DOM節(jié)點(diǎn)，可以很容易地綁定到事件或用于修改。畫(huà)布輸出是一個(gè)完整的畫(huà)布；區(qū)別二：SVG輸出的圖形是矢量圖形，以后可以修改參數(shù)自由縮放，不真實(shí)和鋸齒。canvas輸出標(biāo)量canvas，就像一個(gè)圖像，放大后會(huì)失真或鋸齒狀。

HTML中SVG和CANVAS的區(qū)別？

在動(dòng)畫(huà)中：畫(huà)布的動(dòng)畫(huà)是逐幀渲染的，因?yàn)槊看武秩緦?shí)際上都是靜態(tài)的，動(dòng)態(tài)效果是通過(guò)連續(xù)計(jì)算和重新渲染來(lái)實(shí)現(xiàn)的。通常，我們使用請(qǐng)求動(dòng)畫(huà)幀來(lái)優(yōu)化渲染頻率。對(duì)于不支持的瀏覽器，我們可以調(diào)用setTimeout進(jìn)行計(jì)算，每隔一段時(shí)間重新渲染一次，一般會(huì)將幀速率控制在最小60幀/1秒，以達(dá)到平滑效果，但可能是由于計(jì)算量大，或者機(jī)器性能差，導(dǎo)致阻塞、動(dòng)畫(huà)掉幀，在這方面，您可以在計(jì)算中優(yōu)化算法，也可以把計(jì)算交給web工作者來(lái)處理，以達(dá)到不阻塞頁(yè)面主進(jìn)程的目的；SVG實(shí)際上不同于我們傳統(tǒng)的dom動(dòng)畫(huà)。它支持CSS中的變換、變換等實(shí)現(xiàn)動(dòng)畫(huà)。通過(guò)JS獲取SVG節(jié)點(diǎn)，改變樣式屬性，實(shí)現(xiàn)動(dòng)畫(huà)效果。一般來(lái)說(shuō)，實(shí)現(xiàn)動(dòng)畫(huà)與傳統(tǒng)的DOM是一致的。

至于選擇，其實(shí)各有所長(zhǎng)。它還取決于實(shí)際的使用場(chǎng)景。例如，如果需要實(shí)現(xiàn)一個(gè)小游戲，那么canvas更合適。如果您想實(shí)現(xiàn)一些數(shù)據(jù)圖表的繪制，您仍然喜歡SVG。

當(dāng)然，在動(dòng)畫(huà)方面，也有webgl等選項(xiàng)，在優(yōu)化和功能上都比較先進(jìn)，比如3D、VR等。