svg 简单的转换答案

【问题标题】：Svg simple transformationssvg 简单的转换
【发布时间】：2017-06-12 14:31:48
【问题描述】：

我有一个带有 3 条路径的简单 svg：红色、蓝色和黄色。我想：缩放所有形状（例如 0.3）并仅旋转红色 + 蓝色（例如 90 度）。旋转点应该在红色路径的中间。在这些操作之后，我希望黄色形状与红色路径的距离原始距离按 0.3 缩放。

我的尝试是：

计算红色路径的中间；
在原点 (0,0) 翻译，通过 (-redCenterPoint.x, - redCenterPoint.y) 翻译
将红色路径缩放 0.3
通过 translate(redCenterPoint.x, redCenterPoint.y) 向后移动红色路径
通过计算 blueCenter、yellowCenter 对蓝色和黄色重复相同的操作

我的问题是：我怎样才能保持原始图像结构但按 0.3 缩放并旋转 90？ - 蓝色路径与红色路径接触，黄色路径将原始距离缩放 0.3。

我看到，如果我考虑所有 3 个形状的 redCenterPoint，则该组看起来与原始形状相同，但已缩放，看起来是正确的。我想知道用第一种方法做同样的事情。

svg 文件：

 <g
 inkscape:label="Layer 1"
 inkscape:groupmode="layer"
 id="layer1">
<path
   style="opacity:1;fill:#ff0000"
   d="m 146.98669,417.50473 561.36408,0 0,206.40686 -561.36408,0 z"
   id="red"
   inkscape:label="#table" />
<path
   style="opacity:1;fill:#0000ff"
   d="m 641.11218,339.32031 65.67491,0 0,82.87548 -65.67491,0 z"
   id="blue" />
<path
   style="opacity:1;fill:#ffff00"
   d="m 764.69525,515.63883 55.28473,-55.28473 46.43917,46.43918 -55.28473,55.28472 z"
   id="yellow"
   inkscape:connector-curvature="0"
   inkscape:label="#yellow" />

使用 Riversoft 组件渲染 SVG 的 delphi 代码：

redBounds: TSVGRect;
redCenterPoint: TPointF;
redMatrix: TSVGMatrix

redBounds := (svgDoc.SVG.AllItems['red'] as TSVGGraphicElement).BoundsRect;

 redCenterPoint.x := bDiamond.Left + (bDiamond.Width) / 2;
 redCenterPoint.y := bDiamond.Top + (bDiamond.Height) / 2;

 redMatrix := CreateTranslateRSMatrix(-redCenterPoint.x, -redCenterPoint.y);

  redMatrix := RSMatrixMultiply(redMatrix,
    CreateRotationRSMatrix(TPoint(0,0), DegToRad(90)));

  redMatrix := RSMatrixMultiply(redMatrix,
    CreateScaleRSMatrix(0.3, 0.3));

  redMatrix := RSMatrixMultiply(redMatrix,
    CreateTranslateRSMatrix(redCenterPoint.x, redCenterPoint.y));

    (svgDoc.SVG.AllItems['red'] as TSVGGraphicElement)
      .Matrix := mainMatrix;

【问题讨论】：

这是我的问题：我希望在这些转换之后保持原始图像：蓝色路径与红色路径接触，黄色将原始距离缩放 0.3。应用变换后如何控制蓝色路径的位置。我想成为与乞讨者相同的图像，但按 0.3 缩放。
我不明白你真正想要做什么。旋转？规模？ “保留原始图像”？你能展示一张想要的结果的图片吗？
虽然我觉得理解你想要实现的目标有点困难，但听起来你想将蓝色和红色分组并自行旋转，同时缩放包含所有三个路径的整体组在一起，但我不能确定。特别是关于我不确定的黄色路径。作为 MBo - 你能画一幅画吗？

标签： delphi svg transformation algebra

【解决方案1】：

您所做的是保持每个单独形状的中心不变。那不是你想做的。您希望保持整个形状的中心不变。这就是您在第二次尝试中所做的，将红色中心应用于所有 3 个形状，这就是它看起来更好的原因。您可能想选择一个不同的中心，并且有多种算法可以做到这一点，或者甚至将原点留在原处（根本不费心移动中心）。但是，无论您选择什么，您都必须将相同的中心应用于所有形状以实现您想要的效果，这也适用于旋转（尽管在您的情况下，您只对其中两个形状应用旋转）。但是，旋转中心不必与缩放中心相同。

对于在每种情况下计算新中心的最有效操作，我认为我会使用重心计算，但简单的中心平均也可以很好地工作。

【讨论】：