使用NGraphics将SVG转换为PNG时图像未正常缩放反而被裁剪如何解决

核心问题原因 #

你当前的代码仅创建了100x100像素的画布，没有对读取到的SVG图形做缩放适配，SVG会按照自身原始尺寸直接绘制到画布上，超出画布范围的内容自然就会被裁剪，不会自动缩放到匹配画布尺寸。

具体需要补全的逻辑 #

• 首先读取SVG图形的原始宽高，计算缩放到100x100所需的比例，要等比例缩放避免变形的话就取宽高缩放比的最小值
• 对画布应用缩放变换，或者对Graphic对象应用缩放变换后再绘制

修正后的代码 #

using (StreamReader reader = File.OpenText(svgpath))
{
    SvgReader svgReader = new SvgReader(reader);
    Graphic gr = svgReader.Graphic;
    Size targetSize = new Size(100, 100);
    // 计算缩放比例
    float scaleX = targetSize.Width / gr.Bounds.Width;
    float scaleY = targetSize.Height / gr.Bounds.Height;
    // 取最小比例保证SVG完整显示且不变形，不需要等比例可直接分别使用scaleX、scaleY
    float uniformScale = Math.Min(scaleX, scaleY);
    var c = PlatformSupport.CreateImageCanvas(targetSize);
    // 应用缩放变换
    c.ScaleTransform(uniformScale, uniformScale);
    gr.Draw(c);

    MemoryStream stream = new MemoryStream();
    c.GetImage().SaveAsPng(stream);
    byte[] fileContent = stream.ToArray();
    File.WriteAllBytes(resultPath, fileContent);                
}

可选优化项 #

• 如果需要SVG在100x100画布中居中显示，可以在缩放后额外计算偏移量，调用c.TranslateTransform方法调整绘制起点
• 如果你的SVG本身没有设置正确的viewBox，可以先手动设置Graphic的Bounds再计算缩放比例

内容的提问来源于stack exchange，提问作者N. Saw