可缩放矢量图形（SVG）是一种基于XML的二维矢量图形格式，也可以在HTML中使用。不要仅仅因为您的项目使用SVG而添加此标记。相反，如果您的问题是关于SVG或与其密切相关的问题，请添加标记，例如如何使用SVG实现某些功能。
我想实现拖动点应该始终保持在路径上应该更新命令Q或C或S来更新通过点的曲线，这个可拖动点不应该是控制点...
我应该使用哪种图像格式来进行 ios 开发？ SVG 还是 PNG？
过去 1 个多月以来，我一直致力于 iOS 开发，我所经历的是，我必须为 iphone 放置 1x 2x 3x 的图像，然后为 ipad 放置 2x retina 的图像。一位经验丰富的设计师建议...
我正在研究如何创建一个具有动态/移动背景的div，该背景基于具有三种颜色的径向渐变： 我们的想法是有一个像这样的中心点： 拖动
我花了一整天的时间来处理这个 flutter_svg，但我没有找到问题所在，SVG 仅在调试模式下工作，但在发布模式下不显示。 这里似乎有什么问题？
我正在制作一个 vue.js 应用程序，它使用大量不同的图标，因此我决定在 node.js 中制作一个小图标生成器来标准化它们的使用，并且它还会“裁剪”每个 svg 以使其符合其标准...
对象构造函数内的Javascript setInterval 无法按预期工作
我正在学习 Javascript 对象，我的代码有一个非常奇怪的问题。下面的代码使用 setInterval() 使时钟的时、分、秒臂根据系统时间移动。我添加了一个st...
我有一个 SVG，我试图将其用作包含多个笔划的蒙版图像，但是当用作蒙版图像时，不会显示笔划。 主要的 { 位置：相对； 弹性：1； 爸...
我正在尝试编写一个PHP函数来转换SVG图像而不进行任何抗锯齿（以便最终的PNG是块状的并且仅包含SVG中指定的颜色）。 相当于命令行...
我正在开始我的第一个 React/Next.js 项目，我需要导入一个 SVG 文件并在渲染之前对其进行修改。 我试图找到一些可以让我做到这一点的模块，然后我选择了react-svg https://gi...
如果我有这个 HTML 如果我有这个 HTML <svg xmlns="http://www.w3.org/2000/svg" style="display: none;"> <g id="repeat"> <path fill="currentColor" d="M20.3 13.43a1 1 0 0 0-1.25.65A7.14 7.14 0 0 1 12.18 19A7.1 7.1 0 0 1 5 12a7.1 7.1 0 0 1 7.18-7a7.26 7.26 0 0 1 4.65 1.67l-2.17-.36a1 1 0 0 0-1.15.83a1 1 0 0 0 .83 1.15l4.24.7h.17a1 1 0 0 0 .34-.06a.33.33 0 0 0 .1-.06a.78.78 0 0 0 .2-.11l.09-.11c0-.05.09-.09.13-.15s0-.1.05-.14a1.34 1.34 0 0 0 .07-.18l.75-4a1 1 0 0 0-2-.38l-.27 1.45A9.21 9.21 0 0 0 12.18 3A9.1 9.1 0 0 0 3 12a9.1 9.1 0 0 0 9.18 9A9.12 9.12 0 0 0 21 14.68a1 1 0 0 0-.7-1.25Z" /> </g> </svg> <svg id="btnRepeat" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" role="button"> <use href="#repeat"></use> </svg> 还有这个CSS :root { --norm-colour: green; --high-colour: red; } #btnRepeat { position: absolute; width: 15%; color: var(--norm-colour); } #btnRepeat:hover { color: var(--high-colour); cursor: pointer; } svg 颜色是正确的，并且悬停时会按预期变化。 如果我将选择器从 #btnRepeat:hover 更改为 svg[id^="btn"]:hover 的“通用”形式，则悬停时的颜色不会发生变化（尽管光标发生变化。）为什么通用形式失败了吗？ 因为id选择器具有更高的优先级。 :root { --norm-colour: green; --high-colour: red; } [id^="btn"] { position: absolute; width: 15%; color: var(--norm-colour); } [id^="btn"]:hover { color: var(--high-colour); cursor: pointer; } <svg xmlns="http://www.w3.org/2000/svg" style="display: none;"> <g id="repeat"> <path fill="currentColor" d="M20.3 13.43a1 1 0 0 0-1.25.65A7.14 7.14 0 0 1 12.18 19A7.1 7.1 0 0 1 5 12a7.1 7.1 0 0 1 7.18-7a7.26 7.26 0 0 1 4.65 1.67l-2.17-.36a1 1 0 0 0-1.15.83a1 1 0 0 0 .83 1.15l4.24.7h.17a1 1 0 0 0 .34-.06a.33.33 0 0 0 .1-.06a.78.78 0 0 0 .2-.11l.09-.11c0-.05.09-.09.13-.15s0-.1.05-.14a1.34 1.34 0 0 0 .07-.18l.75-4a1 1 0 0 0-2-.38l-.27 1.45A9.21 9.21 0 0 0 12.18 3A9.1 9.1 0 0 0 3 12a9.1 9.1 0 0 0 9.18 9A9.12 9.12 0 0 0 21 14.68a1 1 0 0 0-.7-1.25Z" /> </g> </svg> <svg id="btnRepeat" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" role="button"> <use href="#repeat"></use> </svg>
我第一次想做网站，但是太难了 https://mapsvg.com/maps/world 这里我下载了一张世界地图，我设置了宽度：100%高度：auto，但是为什么地图被裁剪了？我想要...
Python 中的服务器端 SVG 到 PNG（或其他图像格式）
目前我正在使用 rsvg 加载 svg（从字符串，而不是从文件）并绘制到开罗。有人知道更好的方法吗？我在应用程序的其他地方使用 PIL，但我不知道有什么方法可以做到这一点...
我有一个使用文件输入字段的html通过使用标签标记，外观被自己的文本覆盖。现在我想使用 svg...
我正在尝试创建一个 SVG 徽标。我从 Illustrator 导出了该文件。徽标上有阴影。我正在查看 XML，找到了过滤器节点 我正在尝试创建一个 SVG 徽标。我从 Illustrator 导出了该文件。徽标上有阴影。我查看了 XML，发现了过滤器节点 <filter filterUnits="objectBoundingBox" width="200%" height="160%" x="-15%" y="-15%" id="AI_Shadow_2"> <feGaussianBlur stdDeviation="2" result="blur" in="SourceAlpha"></feGaussianBlur> <feOffset result="offsetBlurredAlpha" in="blur" dy="0" dx="0"></feOffset> <feMerge> <feMergeNode in="offsetBlurredAlpha"></feMergeNode> <feMergeNode in="SourceGraphic"></feMergeNode> </feMerge> 有没有办法改变生成的offsetBlurredAlpha的alpha？我不希望它从纯黑色开始，我希望它从 50% 黑色开始，以便对象周围的阴影效果足够亮。 一种方法是添加一个 feComponentTransfer 过滤器基元，如下所示： <filter id="dropshadow"> <feGaussianBlur in="SourceAlpha" stdDeviation="3"/> <feOffset dx="2" dy="2"/> <feComponentTransfer> <feFuncA type="linear" slope="0.2"/> </feComponentTransfer> <feMerge> <feMergeNode/> <feMergeNode in="SourceGraphic"/> </feMerge> </filter> 可以在这里看到一个实例。 一种方法是简单地使用opacity: 0.5。为此，不要创建将投影与顶部的原始源合并的过滤器，而是为only投影创建一个过滤器，并将其应用到引用源形状的<use>标签。 这种方法还有其他优点。例如，现在您可以仅对阴影应用单独的样式。 #arrow-shadow { opacity:0.5; } g:hover #arrow-shadow { opacity:0.7; } <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-50 -50 200 200" width="400px"> <defs> <filter id="dropshadow" height="130%"> <feGaussianBlur in="SourceAlpha" stdDeviation="3" /> <feOffset dx="2" dy="2" result="offsetblur" /> </filter> </defs> <g fill="#EEE"> <use id="arrow-shadow" xlink:href="#polygon" filter="url(#dropshadow)"></use> <polygon id="polygon" points="58.263,0.056 100,41.85 58.263,83.641 30.662,83.641 62.438,51.866 0,51.866 0,31.611 62.213,31.611 30.605,0 58.263,0.056"/> </g> </svg> 设置 alpha 值的另一种方法是使用 feColorMatrix 过滤器基元。使用它您可以同时设置 alpha 值和阴影的颜色。 下面的滤镜将 alpha 值乘以 0.2，同时将阴影的颜色设置为红色。 <filter id="dropshadow"> <feGaussianBlur in="SourceAlpha" stdDeviation="3"/> <feOffset dx="2" dy="2"/> <feColorMatrix values="0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0"/> <feMerge> <feMergeNode/> <feMergeNode in="SourceGraphic"/> </feMerge> </filter> 但是如果您只需要更改 alpha 值，feComponentTransfer 过滤器基元可能是更好的选择。 我的情况是，我将 svg 中的每个路径或项目设置为遮罩过滤器，之后我将设置不透明度路径：0 并使用过渡不透明度：1
``` ```<svg><g id="SA1A" > <rect id="berthbg-1" data-name="berthbg-1" className="cls-24" x="615.48" y="369.06" width="22.77" height="18" transform="translate(1253.74 756.13) rotate(-180)" /> <text id="indicator-1" data-name="indicator-1" className="cls-48" transform="translate(616.11 384.25) scale(.83 1)"> Hello, How to scroll me in this text inside g tag of svg element? </text></g></svg>``` 下面是盒子的大小（svg 图像）。 我尝试使用溢出和选取框标签，但不起作用，我希望此文本在附加图像框内滚动而不与外部重叠。 一个可能的解决方案是使用如下例所示的符号。 该符号有一个限制视图的viewBox（您只能看到矩形id =“berthbg-1”） 对于动画，我使用 SMIL 并对文本的 x 属性进行动画处理。您可能想选择不同的解决方案。 由于符号中包含了所有内容，因此您需要将符号与 <use> 元素一起使用。 <svg viewBox="615 368 140 20"> <symbol viewBox="615.48 369.06 22.77 18" id="SA1A" > <rect id="berthbg-1" x="615.48" y="369.06" width="22.77" height="18" transform="translate(1253.74 756.13) rotate(-180)" fill="silver" /> <text id="indicator" transform="translate(616.11 384.25) scale(.83 1)" x="409" text-anchor="end"> Hello, How to scroll me in this text inside g tag of svg element? <animate attributeName="x" attributeType="XML" from="409" to="0" dur="20s" repeatCount="indefinite"/> </text> </symbol> <use href="#SA1A" x="615.48" y="369.06" width="22.77" height="18"/> </svg>
Webpack：阻止 css-loader 用散列 svgs 替换 svg url
我意识到我的项目在某个时候停止显示我从 scss 文件链接的 svgs。 我有这样的行： 背景图像：url('./assets/icons/check-icon.svg'); Webpack，我怀疑它是...
在 Delphi 中使用 Skia 在画布上重新计算/绘制 SVG 路径？
skia 中是否有用于画布的内置函数，或者当用户调整表单大小时我应该使用什么来重新计算我的路径，还是我需要自己创建函数和计算？ 我是...
有人可以帮我处理 svg 的胺化吗？ 我正在尝试创建泵叶轮的动画。我想要的是 svg 的最后 4 个元素产生旋转叶轮效果。让它...
我正在开发一个项目，我需要创建具有响应其父容器大小的笔划的 SVG 形状。我希望这些形状始终填充其父级的宽度和高度
这可能会被认为是一个未经研究的快速问题，但我已经偏离轨道几个小时试图弄清楚它。 我最近第一次尝试 MathJax，我制作了一个文本区域