c# - csharp 中使用 Graphics.DrawString 生成的图形呈现不同，具体取决于平台。 (GDI)

Question

对于一个使用 ASP.Net Core 构建的比利时体育社区项目，我使用 C# 动态渲染图像。该图像基于“基础图片”，其中我动态添加文本，然后将图像返回给客户端。

效果很好，我对结果很满意。

但是，当我在我的开发环境(MacOS)上比较客户端生成的图像时，与我的生产环境(Azure 平台中的 Linux VM)相比，该图像呈现得更漂亮。

作为对比，你可以看两张图片，看文字你就会发现差异。在第二张图片中，文本字符串看起来更加像素化。

我可以做些什么来避免这种情况吗？这可能与 GPU 的(不)可用性或类似的情况有关吗？

欢迎任何见解。

(我还将 Nuget 包 runtime.osx.10.10-x64.CoreCompat.System.Drawing 添加到我的项目中，这是在我的 MacOS 上成功运行所必需的)

供引用:相关代码片段:

public async Task<byte[]> CreateImageAsync(YearReview summary)
{
    var fonts = new PrivateFontCollection();
    fonts.AddFontFile(Path.Combine(_hostingEnvironment.WebRootPath, "fonts/bold.ttf"));
    fonts.AddFontFile(Path.Combine(_hostingEnvironment.WebRootPath, "fonts/light.otf"));
    var boldFont = fonts.Families[0];
    var lightFont = fonts.Families[1];

    var assembly = Assembly.GetAssembly(typeof(YearImageGenerator));
    var resourceName = "CotacolApp.StaticData.year-a.png";
    // Leaving out some variable/constants, irrelevant to the sample
    await using (var stream = assembly.GetManifestResourceStream(resourceName))
    {
        var bitmap = new Bitmap(stream);
        using (var gfx = Graphics.FromImage(bitmap))
        {
                using (Font f = new Font(boldFont, 58, FontStyle.Bold, GraphicsUnit.Pixel))
                {
                    gfx.DrawString($"{summary?.UniqueColsInYear.Number()}", f, Brushes.Black,
                        new RectangleF(0, startHeightYear, yearValuesRightBorder, 100f), rightAlignFormat);
                }
        }

        using (var imgStream = new MemoryStream())
        {
            bitmap.Save(imgStream, System.Drawing.Imaging.ImageFormat.Png);
            return imgStream.ToArray();
        }
    }
}

如果比较图片，请查看图片左侧的黑色数字和右侧的黑色文本。

图片，在开发环境(MacOS)上渲染:

图片，在 Azure 云中渲染:

Answer 1

不要使用System.Drawing。 Microsoft 本身对此发出警告 in the documentation 。它存在于 .NET Core 中只是为了兼容性

In .NET 6 and later versions, the System.Drawing.Common package, which includes this type, is only supported on Windows operating systems. Use of this type in cross-platform apps causes compile-time warnings and run-time exceptions. For more information, see System.Drawing.Common only supported on Windows.

链接的文章解释了问题所在，并提供了几种跨平台替代方案，例如 ImageSharp和 SkiaSharp .

System.Drawing 的主要工作是在屏幕上绘制 UI，而不是操作图像。在 Windows 上，它只是 GDI+ 的一个非常薄的包装。等效的跨平台技术是MAUI，目前尚未发布。

ImageSharp 中的等效代码可能是:

using SixLabors.ImageSharp;
using SixLabors.ImageSharp.Processing;
using SixLabors.ImageSharp.Drawing.Processing;
using SixLabors.Fonts;
...
//Load the fonts
FontCollection fonts = new FontCollection();
var boldPath = Path.Combine(_hostingEnvironment.WebRootPath, "fonts/bold.ttf");
var lightPath = Path.Combine(_hostingEnvironment.WebRootPath, "fonts/light.ttf");
var boldFont = fonts.Install(boldPath);
var lightFont = fonts.Install(lightPath);

//Load the image
var image = await Image.LoadAsync(stream);

//Draw the text
string yourText = $"{summary?.UniqueColsInYear.Number()}";

Font font = boldFont.CreateFont(58, FontStyle.Bold);

DrawingOptions options = new DrawingOptions()
{
    TextOptions = new TextOptions
    {
        WrapTextWidth = yearValuesRightBorder,
        HorizontalAlignment = HorizontalAlignment.Right
    }
};

var point = PointF(0, startHeightYear);
image.Mutate(x => x.DrawText(options, yourText, font, Color.Black, point));

//Save as PNG to a buffer
using var ms = new MemoryStream();
await image.SaveAsPngAsync(ms);
return ms.ToArray();

您可以查看 Getting Started section在文档中。 SaveAsPngAsync is a convenience extension method 。 Drawing Text展示了如何在图像和 Fonts 上绘制文本部分显示如何处理字体。