svg 相关问题

可缩放矢量图形（SVG）是一种基于XML的二维矢量图形格式，也可以在HTML中使用。不要仅仅因为您的项目使用SVG而添加此标记。相反，如果您的问题是关于SVG或与其密切相关的问题，请添加标记，例如如何使用SVG实现某些功能。

我正在尝试使用 htmltools（下面的 MRE）保存我在闪亮的应用程序中生成的 .svg。这需要将 svg 命名空间添加到 svg 标签中，并使用 xmlns:xlink="http://www.w3.org/1999/xlink...

svg shiny htmltools

回答 1 投票 0

如何用SVG（+JS）绘制正弦波？

在 SVG 中绘制正弦波的最简单解决方案是什么？我想正弦波应该用 JavaScript 在一个简单的循环中重复......:) 这是 X-Y 坐标，作为一个好的开始......:) http://

javascript html svg

回答 8 投票 0

如何使用字体svg图标

我有一个字体 svg 图标文件。看起来像这样由 IcoMoon 生成我有一个字体 svg 图标文件。看起来像这样 <svg xmlns="http://www.w3.org/2000/svg"> <metadata>Generated by IcoMoon</metadata> <defs> <font id="icomoon" horiz-adv-x="1024"> <font-face units-per-em="1024" ascent="960" descent="-64"/> <missing-glyph horiz-adv-x="1024"/> <glyph unicode="" glyph-name="error" horiz-adv-x="1090" d="M1014.67 137.349c0 0 0 0 0 0l-310.651 310.651 ......"/> </font> </defs> 我使用这个文件作为字体类型 @font-face { font-family: 'System Icons'; url('path/to/font-icon.svg') format('svg'); font-weight: normal; font-style: normal; } 要显示图标，我必须编写 css 规则，例如 .icon-warning { &:before { font-family: "System Icons"; color: #ff934c; content: '\e632'; } } 我的问题632 是什么？在 svg 文件内，有 unicode=""。 632 和  怎么搭配如果我没理解错的话，你只是想知道，这两个字符串是如何相互关联的？在你的CSS中，你选择定义的字体，并想要在你的svg字体中打印一个unicode字符（\ +数字），你使用十进制html实体定义了这个字符，你也可以写unicode="" ，其中数字前面的x告诉你它是一个十六进制数字。所以 e632 只是十进制（基数 10）数字 58880 的十六进制（基数 16）表示。 https://calculator.name/baseconvert/hexadecimal/decimal/e632

css svg font-face

回答 1 投票 0

如何使用javascript将css类分配给svg元素的标题？

我用过这个：那不起作用。我已经添加了您的建议..但它不起作用！ svg { 宽度：720px；高度：50px；边框：#999999 实心 2px； } .工具提示{ 显示方式：内嵌；位置：

javascript jquery html css svg

回答 2 投票 0

为什么我的 SVG 文本有时会呈现在错误的位置？

我有一个包含文本元素的 SVG 文件。该文件位于维基共享资源上。我用作示例的文本是： (s∘r)2 我有一个包含文本元素的 SVG 文件。该文件位于维基共享资源上的此处。我用作示例的文本是： (s∘r)2 <g style="text-anchor: middle; letter-spacing: -1;" font-size="25px" font-family="sans-serif"> <text x="500"> (s∘r) <tspan baseline-shift="super" font-size="18px">2</tspan> </text> </g> 在 Ubuntu 上的图像查看器中渲染，看起来应该如此。当我用 Inkscape 打开它时也是如此。在 Firefox 中，它看起来几乎相同，只是 baseline-shift 不起作用。但在维基共享资源上呈现时，它被移至右侧。我认为没有理由这样做。（上面较短的文本元素不会发生这种情况。） Commons 渲染器是否做错了什么？或者我的代码是否足够模糊以允许这样做？我的SVG的width和height比实际尺寸大10倍。这可能是原因吗？编辑：问题是由tspan标签引起的。这个文件更清楚地说明了这一点。我在 Commons 上问了一个问题。这确实是 Commons 上的一个错误。看起来像 WMF 在 2023 年 4 月重新引入的旧文本块错误，当时它从 (IIRC) 三年前的 rsvg 版本切换到五年前的 rsvg 版本。

svg

回答 1 投票 0

如何在 DDEV 中启用对 Imagemagick 的 SVG 支持

我需要进行一些 SVG 操作，特别是从 SVG 图标创建 PNG 缩略图。当通过 MAMP 运行站点时，这可以正常工作，但通过 DDEV 运行站点时，则不行。运行转换时 -

svg debian imagemagick debian-stretch ddev

回答 3 投票 0

即使 Spring Boot 项目的 html 页面上的路径正确，svg 文件也无法打开

我打算在我的 Spring Boot thymeleaf 项目中使用 Metronic html 登录页面，所以我更新了代码以导入资产。我打算在我的 Spring Boot thymeleaf 项目中使用 Metronic html 登录页面，所以我更新了代码以导入资产。 <link th:href="@{/uploads/assets/plugins/global/plugins.bundle.css}" rel="stylesheet" type="text/css" /> <link th:href="@{/uploads/assets/css/style.bundle.css}" rel="stylesheet" type="text/css" /> css 文件已加载并应用到页面上，但 svg 文件未打开。我只能将替代“徽标”视为文本。  <a href="/index.html" class="mb-7"> <img alt="Logo" th:src="@{/uploads/assets/media/logos/logo.svg}" /> </a> 如果我将 png 文件放在同一路径中，那么它就可以工作 <a href="/index.html" class="mb-7"> <img alt="Logo" th:src="@{/uploads/assets/media/logos/logo.png}" /> </a> 请帮我找出这个原因登录页面实际上有4个svg文件，但都打不开。关于我的项目主题 svg 文件有效

html spring-boot spring-mvc svg thymeleaf

回答 1 投票 0

SVG Framer 运动 - 如何指定方向？

我正在使用成帧器运动来制作 SVG 动画，尽管我无法控制动画路径的方向。有的从左到右，有的从右到左，如何控制方向？我试过了

reactjs animation svg next.js framer-motion

回答 1 投票 0

使用 CRA 延迟加载 SVG

我想用 CRA 延迟加载 SVG，但该死的我被困住了，需要你的帮助。我正在尝试做这样的事情： const LoadIcon = (名称) => 惰性(() => 导入(`../icons/${name}.svg`)); 常量

reactjs svg lazy-loading create-react-app

回答 3 投票 0

flexbox 中的图像标签导致溢出

我正在使用顺风，并尝试在固定高度的容器内创建一个四分之一的弹性盒。弹性盒不应溢出该固定高度。在我添加 img 元素之前它工作得很好。