从 D3.js v4 迁移到 D3.js v7 不工作

[英]Migrating from D3.js v4 to D3.js v7 not working

我想尝试将此力从 D3 v4 转换为 v7，但不确定如何将其转换为 go。我所做的代码转换在这里。 我尝试这样做< https://observablehq.com/@d3/d3v6-migration-guide> D3 6.0 已经出来了。 它带有令人兴奋的新功能和改进。 它还介绍 ...

CSS Animation 将页面上的图标滚动到路径

[英]CSS Animation move icon on page scroll to a path

我想创建一个 CSS animation，其中箭头在滚动时沿着 SVG 蛇形路径移动，并在每个新部分更改图标。 这是我的页面设计供参考。 我看了几个例子： codepen.io/yesvin/pen/XymwvX codepen.io/gkando/pen/LYEvjOv 但是我无法用我的页面设 ...

Svg 文件显示不正常

[英]Svg file not displaying properly

我正在使用flutter_svg: ^1.1.6 package。我想显示的 svg 文件显示不正确。 我也试过清理 svg 但没有成功。 图像上的 Colors 看起来完全褪色了。我将附上代码和图像以供参考。 代码： 我也试过清理 svg 但没有成功。 ...

按照 SVG 路径圈出

[英]Circle following SVG path

我在 svg 路径上有粉红色圆圈和一只眼睛，如下所示： 圆圈和眼睛应该在第一个灰色圆圈上旋转。 我怎样才能做到这一点？ 这是我的灵感 (codepen) 。 .ball { width: 20px; height: 20px; background-color: green; border-rad ...

SIMPLE – 按顺序为多个 SVG 制作动画（如循环 GIF）

[英]SIMPLE – Animate Multiple SVGs in Sequence (like a looping GIF)

我正在尝试做最基本的SVG animation ，我发现的一切都在试图教我关键帧和类似的高级东西。 我在 After Effects 中了解关键帧，而这根本不是我需要的。 我想要做的就是按顺序为相同的 8 个 svg 路径制作动画，就像翻书一样，我可以在其中轻松编辑循环速度。 我希望图像更改为 c ...

vite-plugin-svgr 的类型定义？

[英]Type definition for vite-plugin-svgr?

我在将道具添加到 Svg 时出现 typescript 错误，因为 ReactComponent- 类型不可分配给类型“IntrinsicAttributes”。 插件：vite-plugin-svgr vite.config.ts - 添加 到 ts 编译器，我导入 svg 之类的 有什么建议 ...

如何 ggsave() 一个 grid.arranged plot 作为 SVG

[英]how to ggsave() a grid.arranged plot as SVG

我有代码生成两个单独的 ggplots 并使用gridExtra::grid.arrange将它们组合成一个图形。 我可以使用ggsave()将这个组合图保存为 PNG，但如果我尝试将它保存为 SVG 文件，我只会得到第二个图。 如何在一个 SVG 文件中获取这两个数字？ 编辑：这个问题超出了Ho ...

使svg图案内容从框架中溢出<pattern> , 而不是被切断</pattern>

[英]Make svg pattern content overflow from the frame of <pattern>, rather than being cut off

我创建了一个带有图标的图案。 用户可以拖动 slider 来旋转图案的图标。 这是我的代码： const slider = document.getElementById("slider") const carrotIcon = document.getElementById("carrotIco ...

某些 SVG 使用 wkhtmltopdf 无法在 PDF 中得到 rendererd

[英]Some SVGs do not get rendererd in PDF using wkhtmltopdf

我们已经到了知识的尽头。 我们正在使用 twig 模板生成 html 页面，然后由 wkhtmltopdf 在 Ubuntu 18.04 机器上呈现为 PDF。 当前的问题是，我们还使用 Inkscape 将许多旧的 EPS 文件移动到 SVG，一切都按预期进行。 图片显示在 PDF 中。 现在我 ...

如何将圆锥渐变应用于 svg 笔画？

[英]How to apply conic gradient to svg stroke?

知道怎么做吗？ 期待这个： https://codesandbox.io/s/how-to-apply-conic-gradient-to-svg-stroke-cbx37l ...

缩放原点剪切路径 SVG {相机快门}

[英]Scale Origin Clipped Path SVG {Camera Shutter}

我正在尝试复制相机快门，看起来好像我的路径是从左上角缩放的，基于其在剪切路径中的 position。 我已将变换原点设置为 50%，但它似乎没有按照我期望的方式工作。 任何援助将不胜感激。 #camera-v3c.cls-2 { fill: #231f20 } #camera-v3c.cls-4 ...

TypeScript SVG 作为 React 组件导入 - 元素类型无效：应为字符串（用于内置组件）或类/函数

[英]TypeScript SVG import as a React Component - Element type is invalid: expected a string (for built-in components) or a class/function

我正在尝试导入 svg 作为反应组件。 我已经安装了svgr 。 我还添加了 svg 类型定义： 以上也包含在我的tsconfig.json 当我尝试导入 svg 时： 它抛出： 任何帮助深表感谢！ ...

如何在 Angular 2 中设置属性 d pf 路径元素？

[英]How to set attribute d pf path element in Angular 2?

我正在从事 Angular2 项目。 这是一个服务文件。 我正在使用此服务访问我的 Component's.ts 文件中的数据。 我想使用坐标数组在 svg 上绘制折线。在模板文件中，我试图设置路径元素的属性“d”，但无法找出正确的语法来这样做。 以下是组件的.html文件部分 ...

NS_BINDING_ABORTED 仅包含 svg 张图片

[英]NS_BINDING_ABORTED with svg images only

我有一个简单的 JavaScript 代码，它在验证码图像刷新时生成等待加载微调器。 该脚本适用于gif图像，但对于动画svg图像，加载微调器不起作用，并且在 FireFox 中在浏览器的.network 控制台中返回NS_BINDING_ABORTED 。 这是代码：$(document).rea ...

如何更改flutter中svg图像的大小？

[英]how to change size of svg image in flutter?

我使用flutter_svg: ^0.18.0在我的项目中使用 svg 图像。 但是我找不到合适的方法来改变它的大小。 这是我的代码 ...

CSS 背景图像 SVG 覆盖边缘

[英]CSS background-image SVG capped on edges

我正在尝试使用虚线边框生成器，但在生成的 SVG 中，我注意到边缘被封住了，有什么想法可以避免这种情况吗？ .block { width: 400px; height: 400px; background-image: url("data:image/svg+xml,%3csvg width='1 ...

我不明白 SVG 缩放。 Svg 是不是满了 canvas 宽高

[英]I don't understand SVG scaling. Svg is not it's full canvas width and height

我希望这个 svg 的宽度和高度为 69px。 但它不是缩放或者我不理解 viewbox。 图片在这里我知道 width 和 height 适用于rect ， path等，而viewbox是 canvas ，其中 svg 位于其中。 正如您从下面的代码片段中看到的那样。 svg 是 69px，但里 ...

使 svg 图像 object 可点击 onclick，避免绝对定位

[英]Making an svg image object clickable with onclick, avoiding absolute positioning

我试图将我网站上的图像从img更改为svg ，将img标签更改为embed和object标签。 但是，实施之前包含在img标签中的onclick function 被证明是最困难的。 我发现onclick放在object或embed标签内时没有任何效果。 所以，我专门为svg制作了一个div ，并将 ...

用document.querySelectorAll根据class搜索，文本内容

[英]Search with document.querySelectorAll based on class, text content

我有一个搜索框，可帮助用户通过此链接浏览学校的房间。 尝试搜索基于用户的输入，而如果用户输入的任何内容与基于 class + SVG 矩形元素（房间号文本或学校 class 名称）中的文本内容的查询选择器匹配，则将用户带到特定楼层 +突出房间。 我正在努力解决的部分在这个floors.js 文件中如 ...

如何防止硬编码下面的 CSS animation？

[英]How can I prevent hard coding the CSS animation below?

我正在使用@keyframes为这个 svg 设置动画： .candles { width: -webkit-fill-available; transition: all 0.5s; }.candles line, path{ stroke: #5ABCF3; animation-name: ...