程序图中的代码重用（DRY）？

Question

我正在构建一个使用d3js渲染的工作流工具。我最初在＆＃34;编辑器中创建了该工具。模式，用户可以在工作流中拖动和操作节点和依赖项。现在我很难理性化正确的方法来使我当前的绘制程序支持＆＃34;查看＆＃34;和＆＃34;编辑＆＃34;模式和保持干燥。

我的初始代码基本上是一个长抽奖程序：

1. 定义JS原型
2. 创建初始d3js网格（缩放/平移网格）
3. 功能：定义菜单系统
4. 功能：绘制依赖关系（d3js中的svg组）
5. 功能：绘制节点（d3js中的svg组）
6. 获取数据，迭代＆amp;实例化，迭代和绘制依赖关系，迭代和绘制节点

在模式行为或SVG结构不同的每个函数中添加开关逻辑似乎是意大利面条代码之路。

对于每种模式都有3个独立的程序感觉同样错误 - 但我开始认为有一个独特的＆＃34;平局＆＃34;每种模式的程序更灵活，有三种模式。

也许我在思考＆＃39;关于这一切都错了。也许我应该首先以只读模式渲染所有内容然后应用任何＆＃34;编辑＆＃34;或＆＃34;监控＆＃34;之后的模式行为或视觉添加。

什么是以干燥的方式支持多个相似但不同的抽奖程序的最佳方式？