Microsoft Agent Framework 测试豆包的根据图片生成矢量图的能力

输入的测试图片：

提示词代码：

1. ChatMessage message =                     new ChatMessage(ChatRole.User,                [                    new TextContent("根据以下图片，生成矢量图的 Path 路径，要求 Path 路径是 svg 路径。你可以生成多段 Path 路径，分别给这些 Path 路径着色"),                    new UriContent("http://cdn.lindexi.site/lindexi-20260313160236.jpg","image/jpg")                ])        ;

复制代码

豆包输出如下：

1. 思考：用户现在需要把这张钢铁侠的图转成svg的path，首先我得先理清楚结构，分不同的部分，背景、铁霸王、托尼的脸、马克装甲各个部分，每个path给对应的fill对吧？首先先确定svg的视口，比如设成width="600" height="1080" viewBox="0 0 600 1080"，这样比例和原图一致。首先先做背景：深蓝色的背景，path就是整个画布，fill="#0a2a4a"对吧。然后是铁霸王的部分，首先铁霸王的装甲是青灰色，#3a5f6e，然后他的眼睛是发光蓝，#00ccff，胸口反应炉也是亮蓝，还有高光白色的部分。然后是托尼的部分：头发是黑色#111111，肤色是浅黄#f2d2a0，胡子是黑色。然后他的装甲：红色部分#e63923，金色部分#f0c239，反应炉是亮蓝#e0f7ff，还有金属高光的部分，还有黑色的描边，哦对，美漫风格都有黑描边，所以可以加个stroke="#000000" stroke-width="2"之类的。不对，用户要的是path路径，每个路径对应不同的颜色，我得尽量分主要的块，不可能太细，但是主要部分要对。首先先列出来各个部分：1. 背景路径：直接M0 0 H600 V1080 H0 Z，填充深蓝色#082440，没有描边。2. 铁霸王主体装甲路径：大概的轮廓，填充#335a6b，描边黑色。3. 铁霸王眼睛：两个小的path，填充#00d9ff，外发光？哦不对svg可以加滤镜，但是用户要path的话就直接填亮色就行。4. 铁霸王胸口反应炉：外圈是银灰色#94a3a8，内圈亮蓝#45e0ff，中心白色#ffffff。5. 托尼的头发：路径填充#121212，描边黑。6. 托尼的面部皮肤：填充#f0c99d，描边黑。7. 托尼的胡子、眉毛：填充#121212，无额外描边。8. 托尼装甲红色主体部分：填充#e03020，描边黑。9. 托尼装甲金色部分：填充#eebb30，描边黑。10. 托尼胸口反应炉：外圈银灰#b4c0c4，内圈亮蓝#b0f0ff，中心白色#ffffff。11. 手里的头盔：金色部分#eebb30，红色部分#e03020，描边黑。12. 所有轮廓的描边？不对，其实每个path都带stroke就可以了。哦对了，我要把path写出来，还要说明每个的颜色，还要注意是简化的矢量版，因为原图细节很多，不可能完全还原，是风格化还原对吧？还要和用户说明，这个是核心元素的简化矢量路径，你可以根据需求调整细节和配色。等下，path的坐标要对应viewBox，我尽量写的合理。比如背景最简单：然后铁霸王的轮廓：比如这个大概是铁霸王的整体形状对吧。然后铁霸王的眼睛：两个，，对吧。然后铁霸王胸口反应炉：外圈，内圈蓝，中心白。然后托尼的头发：托尼的脸：胡子眉毛：然后装甲红色部分，主体：装甲金色部分，手臂的：手里的头盔：托尼胸口反应炉：哦对了，还要把这些都放到svg标签里，然后和用户说明，这个是简化版的矢量路径，保留了核心的视觉元素，如果你需要更高精度的可以使用矢量追踪工具（比如inkscape的追踪位图功能）处理原图得到更精细的路径，现在这个是手绘风格的简化适配，美漫的描边风格也保留了。等下，有没有坐标的问题？哦没事，viewBox我设成0 0 1000 1600？不对刚才我写的坐标好像有点乱，调整下viewBox就好，比如把svg标签写成 这样就没问题，所有path都能放下。对了还要说明每个path对应的部分，还有颜色可以自行调整。比如你要改装甲的红色深浅，直接改fill值就可以。好的，现在整理成完整的代码，加上注释说明每个部分的作用。--------以下是**简化风格适配的SVG矢量路径**，保留了原图核心美漫风格+核心元素，你可以直接使用，也可以调整`fill`属性修改配色、调整`d`路径补充细节：` ``svg                                                      ` ``如果需要更高精度的路径，你可以使用Inkscape/Illustrator的「位图追踪」功能导入原图生成全细节矢量文件。

复制代码

输出的矢量图 svg 代码如下：

1.                                                       

复制代码

豆包生成的 svg 渲染图如下：

可见当前的效果还是比较差的，不能直接用这个方法转换图片为矢量图。但豆包还是理解了图片里面的内容
本文的核心代码如下：

1. using System;using System.ClientModel;using Microsoft.Agents.AI;using Microsoft.Agents.AI.Reasoning;using Microsoft.Extensions.AI;using OpenAI;using OpenAI.Chat;using ChatMessage = Microsoft.Extensions.AI.ChatMessage;var keyFile = @"C:\lindexi\Work\Doubao.txt"; // 换成你自己的密钥var key = File.ReadAllText(keyFile);var openAiClient = new OpenAIClient(new ApiKeyCredential(key), new OpenAIClientOptions(){    Endpoint = new Uri("https://ark.cn-beijing.volces.com/api/v3")});var chatClient = openAiClient.GetChatClient("ep-20260306101224-c8mtg"); // 换成你自己的模型ChatClientAgent aiAgent = chatClient.AsAIAgent();ChatMessage message =                     new ChatMessage(ChatRole.User,                [                    new TextContent("根据以下图片，生成矢量图的 Path 路径，要求 Path 路径是 svg 路径。你可以生成多段 Path 路径，分别给这些 Path 路径着色"),                    new UriContent("http://cdn.lindexi.site/lindexi-20260313160236.jpg","image/jpg")                ])        ;await foreach (var agentRunResponseUpdate in aiAgent.RunReasoningStreamingAsync(message)){    if (agentRunResponseUpdate.IsFirstThinking)    {        Console.WriteLine("思考：");    }    if (agentRunResponseUpdate.Reasoning is not null)    {        Console.Write(agentRunResponseUpdate.Reasoning);    }    if (agentRunResponseUpdate.IsThinkingEnd)    {        Console.WriteLine();        Console.WriteLine("--------");    }    var text = agentRunResponseUpdate.Text;    if (!string.IsNullOrEmpty(text))    {        Console.Write(text);    }}Console.WriteLine();Console.Read();

复制代码

如对与豆包对接部分感兴趣，请参阅 C# Microsoft Agent Framework 与 豆包 对接
取出思考内容部分，请参阅 Microsoft Agent Framework 取出 DeepSeek 思考内容
本文代码放在 github 和 gitee 上，可以使用如下命令行拉取代码。我整个代码仓库比较庞大，使用以下命令行可以进行部分拉取，拉取速度比较快
先创建一个空文件夹，接着使用命令行 cd 命令进入此空文件夹，在命令行里面输入以下代码，即可获取到本文的代码

1. git initgit remote add origin https://gitee.com/lindexi/lindexi_gd.gitgit pull origin 59f98ae713b16e90e7c1e6c7849599e2d203cdcc

复制代码

以上使用的是国内的 gitee 的源，如果 gitee 不能访问，请替换为 github 的源。请在命令行继续输入以下代码，将 gitee 源换成 github 源进行拉取代码。如果依然拉取不到代码，可以发邮件向我要代码

1. git remote remove origingit remote add origin https://github.com/lindexi/lindexi_gd.gitgit pull origin 59f98ae713b16e90e7c1e6c7849599e2d203cdcc

复制代码

获取代码之后，进入 SemanticKernelSamples/LachawakujehemjayKewhuwheawochearlafi 文件夹，即可获取到源代码
更多技术博客，请参阅 博客导航

来源：程序园用户自行投稿发布，如果侵权，请联系站长删除
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！