javascript - Canvas 渲染一次,完成所有操作

标签 javascript html canvas

有一瞬间有点困惑,感谢任何帮助。

我正在制作一个应用程序,它使用 Canvas 来渲染游戏板。 我遇到了一个问题,即它不是最佳的,为每个小变化渲染 Canvas 。

目前的结构是这样的:

function renderCanvas() {
  // calling for each row
}

function renderRow() {
  // calling for each cell
}

function renderCell() {
  // Here i use FillRect and StrokeRect both
}

函数通过相互传递上下文进行协作。

现在它渲染每个单元格。而且使用 beginPath 似乎只处理中风。

我想知道我是否可以在 renderCanvas 函数中以某种方式启动路径(如 beginPath),并且在完成所有上下文操作之后 - 我可以渲染一次吗?

最佳答案

每个 beginPath 只能做一个样式...

因此,如果您的单元格需要不同的颜色、字体、不透明度,那么您必须为每种不同的样式执行一个 beginPath(但您可以将相同的样式组合到一个 beginPath 中)。

关于javascript - Canvas 渲染一次,完成所有操作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32933113/

相关文章:

javascript - 如何使 push、unshift、pop 和 shift 仅适用于 javascript 中的本地数组?

javascript - jquery加载页面片段加载双div id

javascript - 我如何使用本地存储来存储多个变量的值?

wpf - 使用拇指移动转换后的控件会产生奇怪的行为

javascript - 将环境变量与常量进行比较时,字符串比较在 Javascript 中不起作用

javascript - 如何正确更新 react 状态

html - 为什么我的背景图片没有覆盖整个页面?

javascript - jquery ui 弄乱了工具提示

javascript - 在 html5 canvas 中渲染大量元素

javascript - Canvas 重新绘制被卡住(性能问题)