SVG线性渐变的缩放和平移问题

Question

我有以下径向渐变：

<radialGradient
   inkscape:collect="always"
   xlink:href="#linearGradient2454"
   id="radialGradient2460"
   cx="4022.8572"
   cy="5451.2656"
   fx="4022.8572"
   fy="5451.2656"
   r="3559.865"
   gradientTransform="matrix(-0.1071067,-0.1166362,0.1377765,-7.0459663e-2,276.61943,1452.439)"
   gradientUnits="userSpaceOnUse" />

我想将这个渐变的大小缩小90%，并根据这个新的比例尺适当地进行平移（x位置变为402.2，y位置变为545.1等）。

显然，将cx、cy、fx、fy和r乘以0.1可以解决部分问题。但是，如何在程序中重新设计gradientTransform来解决剩下的问题呢？

- jsight

---

“（x位置变成402，y位置变成5451。” 你打错了，对吧？ - räph

Answer 1

我建议您保留参数（cx、fx、r等）不变。只需将现有的转换矩阵与新的缩放矩阵相乘即可。得到的矩阵就是您渐变的新转换矩阵。

如果您想以中心为基准进行缩放，则还需要在缩放矩阵中添加一个平移量。

所以，如果要进行0.1倍的缩放，则应该这样做：

newGradientTansform = 
oldGradienTransform * matrix(s, 0, 0, s, -cx*(s-1), -cy*(s-1))

- räph