尝试围绕D3 v4缩放的特定用例。到目前为止我的例子可以在这里找到：
http://bl.ocks.org/gmarler/f6d17432f6eea34318bff477eb9ebd27
我可以根据需要绘制我的初始分区布局（我已经忽略了文本定位和颜色等复杂性），但是我没有在缩放方面做得很好。
目标是在点击其中一个svg rect元素时进行缩放。
通过＆＃34; zoom＆＃34;，我的意思是与陈述的默认行为有些不同：
- 完全禁用除元素点击之外的任何内容 - 无法通常与D3缩放关联的拖动，平移或鼠标滚轮活动。
- 当单击svg rect元素时，元素仅在X维度中展开（或收缩），使其左侧邻接顶级svg容器的左侧，并且其右侧邻接顶级svg＆＃39; sg容器的右侧。
- 垂直所有其他g / rect元素＆＃34;以上＆＃34;点击的应该适当缩放/翻译。
- 所有其他元素垂直＆＃34;低于＆＃34;所点击的人不需要改变，因为我们点击的那个将占据图表容器宽度的100％。
所以，在这里我走了多远：
- 我计算了比例因子（k） - 不确定我做得对。目标是将缩放系数设置为使点击元素的宽度扩展/收缩到svg宽度的任何值。
- 并且我已经计算出x（tx）的变换是否会导致封装rect元素的g元素的左侧与svg的左侧对齐。
- 使用k和tx，我使用d3.zoomIdentity.translate（tx，0）创建缩放变换.scale（k）
- 现在我选择所有包含rects的g元素，撕掉当前的transform =＆＃34; translate（x，y）＆＃34;分开，并将缩放变换应用于翻译的x部分 - 这应该将元素的左侧移动到svg的左侧
- 接下来，我选择每个g元素下的rect，并将缩放变换应用于width属性
这似乎让我更接近最终目标，但我确定我错过了一些东西：
- 我真的有必要撕开变换=＆＃34;翻译（x，y）＆＃34;我对g元素的看法？
- 如果我多次点击某些元素，缩放比例会不断增加。我需要两个：
- 保持原始缩放比率，以便我可以重置为它，或者只需单击最低的矩形元素即可返回到它。
- 如果单击某个元素，它已经是100％宽度 - 我需要永远不允许缩放超过100％宽度
- 点击任何给定元素，第一次将其扩展为100％宽度，但不是所有元素＆＃39;祖先适当缩放 - 我不在乎祖先是否扩展到视口边缘的任何一端，但是一些祖先元素完全离开了视口，我无法解释。