Canvas 如何与 MVC 框架一起使用？

Posted 2023-02-22

【中文标题】Canvas 如何与 MVC 框架一起使用？

【英文标题】：How does the Canvas work with MVC Frameworks?

【发布时间】：2013-02-07 19:01:14

【问题描述】：

我一直在研究 AngularJS 及其 MVC 解决方案。通常，MVC 框架使用 html 结构本身来绑定到后端数据模型。在 AngularJS 的情况下，这是通过 Directives 完成的，这对于直接 HTML 非常有效。

对于我的场景，我有一个数据模型，它将在即时模式 Canvas 上转换为可视化表示。然后，还需要与呈现的可视项进行交互，以便编辑后端数据模型中的值。

在 MVC 框架内的数据模型中，在项目和项目值之间实现这种双向绑定的最佳方法是什么？

【问题讨论】：

5 个月后，您决定使用什么，效果如何？我面临着同样的决定，想听听你的进展。

【参考方案1】：

Angulars 的优势在于它可以为您处理 DOM，而您不必担心它。如果你改用 SVG，你可以让 Angular 处理更新视图，因为 SVG 是 DOM，但如果你需要使用画布，Angular 无法为你处理绘图。

您仍然可以从使用 Angular 中受益，方法是使用手表并在数据更改时重绘画布，但您需要自己处理绘图。

【讨论】：

移动平台上的速度以及我的工具的性质需要画布。也许像 Fabric 或 Kinetic 这样的 API 可以更轻松地将模型映射到画布和双向绑定？不确定，因为我还没有找到这方面的例子。我仍然想使用浮动在画布顶部的基于 DOM 的 DIV、SVG 和 D3 小部件。例如简单的基于 DIV 的图标作为基于 HUD 的工具在画布之上，这些仍然可以有 AngularJS 指令。也没有见过这样的例子，但我相信它可以做到。