Snap SVG-通过一个拖动手柄缩放两个元素

时间:2018-07-20 14:35:26

标签: svg resize transform snap.svg

我正在尝试通过Y轴上的“一个”拖动手柄缩放两个可调整大小的元素。 中间拖动手柄应保持相同的Y位置,并将两个可调整大小的元素相应地缩放到中间拖动手柄的位置。

/*
top-resizable data (line 964 on jsfiddle/js)
---
attrs:
   center:{x: 269, y: 98.83271026611328}
   ratio:1.0968256025688532
   rotate:0
   scale:{x: 1, y: 0.9117219708018487}
   size:{x: 530, y: 173.66542053222656}
   translate:{x: 0, y: -7}
   x:4
   y:12
   origDiffMatrix:f {a: 1, b: 0, c: 0, d: 1, e: 158, …}
   origGlobalMatrix:f {a: 1, b: 0, c: 0, d: 1, e: 158, …}
   origLocalMatrix:f {a: 1, b: 0, c: 0, d: 1, e: 0, …}
   origTransform:f {a: 1, b: 0, c: 0, d: 1, e: 0, …}
---
bottom-resizable data (line 966)
---
attrs:
   center:{x: 268, y: 329.2294158935547}
   ratio:1
   rotate:0
   scale:{x: 1, y: 1}
   size:{x: 530, y: 258.4588317871094}
   translate:{x: 0, y: 0}
   x:3
   y:200
   origDiffMatrix:f {a: 1, b: 0, c: 0, d: 1, e: 158, …}
   origGlobalMatrix:f {a: 1, b: 0, c: 0, d: 1, e: 158, …}
   origLocalMatrix:f {a: 1, b: 0, c: 0, d: 1, e: 0, …}
   origTransform:f {a: 1, b: 0, c: 0, d: 1, e: 0, …}
*/

http://jsfiddle.net/n00b0dy/skzod5xw/18/

有人可以帮我找到实现这一目标的方法吗?

0 个答案:

没有答案