javascript - 直接在 Canvas 上设置路径的 alpha channel 中的每个点

标签 javascript html canvas alpha pixel-manipulation

假设我有一个 Canvas ,上面有东西,我想在它的中心雕刻一个椭圆,它的所有像素的 alpha 都为 0,让 Canvas 后面的所有东西都通过,并且之前假设现在由椭圆填充的区域是其他东西,并且说,出于性能原因,我不想使用 putImageData,我该怎么做? 如果没有办法,我该如何使用 putImageData 来雕刻椭圆?

只是说清楚:我不想在 Canvas 上绘制 html 元素,我希望它们只是在 html 中后面

最佳答案

您可以在绘制框架后使用 context.globalCompositeOperation = 'destination-out'填充剪裁的形状。

示例:http://jsfiddle.net/rlemon/6nEpc/

关于javascript - 直接在 Canvas 上设置路径的 alpha channel 中的每个点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23208255/

相关文章:

javascript - APEX:如何实现循环级联选择列表(多对多)

javascript - 如何在 Highcharts 中标记特定区域

html - 无法在正确的位置获得 wordpress 搜索栏

javascript - 如何使javascript Canvas 绘制更快?

jquery - Canvas 外导航菜单无法正常工作

javascript - 在 JavaScript 中使用对象作为属性键

javascript - 如何将预定的 Angular 变量拆分为单独的变量

html - 如何删除 MathJax 中数学的顶部/底部填充?

javascript - 允许在不同屏幕尺寸的菜单上显示和隐藏的功能

javascript - Chrome 不会在 Canvas 中显示 "new Image()"