SVG WPF C# 渲染问题

Question

从 SVG 渲染库 1.7.0（使用 NuGet 安装）开始时，我遇到了一个我无法理解的问题。使用最简单的 SVG 内容（带有清晰可辨的黑色边框的填充矩形）：

<svg  xmlns="http://www.w3.org/2000/svg"
      xmlns:xlink="http://www.w3.org/1999/xlink">
    <rect x="0" y="0" height="50" width="50"
          style="stroke:#000000; fill: #efefef"/>
</svg>

然后我继续加载并使用位图和图片框显示它：

        String path = Path.Combine(
            AppDomain.CurrentDomain.BaseDirectory,
            "etc\simple.svg");

        var svgDocument = SvgDocument.Open(path);
        bitmap = new Bitmap(50, 50, PixelFormat.Format32bppArgb);
        svgDocument.Draw(bitmap);
        var ms = new MemoryStream();
        bitmap.Save(ms, ImageFormat.Png);
        ms.Position = 0;

        var bi = new BitmapImage();
        bi.BeginInit();
        bi.StreamSource = ms;
        bi.EndInit();

        img.Source = bi;

因此，将一个 50 x 50 的矩形渲染为一个 50 x 50 的位图应该给我一个非缩放的完整图像，该图像由一个被黑色边框包围的灰色方块组成。然而发生的是边框的顶部和左侧被切断。

从概念上讲，我显然遗漏了一些东西，比如位图大小、视口和缩放给我混合的结果，一两个工作但没有任何理解。

这里是修改后的源代码，经过测试 - 感谢 Robert 的建议： bitmap = new Bitmap(51, 51, PixelFormat.Format32bppArgb);

        svgDocument.Transforms.Add(new SvgTranslate(.5f, .5f));
        svgDocument.Draw(bitmap);

谢谢，高维

Answer 1

笔划在边缘内部绘制 1/2，在边缘外部绘制 1/2，因此您正在绘制的笔划在边缘部分被切断，因为您的形状实际上是 1/2（左边缘笔划）+ 50 + 1 /2（右边缘笔划）= 51 个单位宽，同样它也是 51 个单位高。

您可以将矩形定位在 0.5、0.5 处，然后将其缩小或将位图放大以完全显示它。

SVG 规范说

‘stroke’属性沿着给定图形元素的轮廓绘制。

SVG WPF C# 渲染问题

SVG WPF C# Rendering Issue

wpf

svg

rendering