使用div的“ transform：scale（）”缩放功能时出现问题

Question

当我对transform容器或应用了缩放的div应用缩放属性时，会完全缩小或放大。我的目标是将父div固定为视图窗口，并将缩放应用于div的内部元素。

<div class="container">
  <div id="panzoom">
    <div class="diagram">
      <div id="i0"  class="item">Root!</div>
      <div id="i1" class="item">Child 1</div>
      <div  id="i11" class="item">Child 1.1</div>
      <div  id="i12" class="item">Child 1.2</div>
      <div id="i2" class="item">Child 2</div>
      <div id="i21" class="item">Child 2.1</div>
      <div id="i3" class="item">Child 3</div>
    </div>
  </div>
</div>

我需要将panzoom固定为查看窗口，并缩放diagram，以便图内的可拖动项可以拖动整个视图窗口（panzoom）。