草庐IT

mermaid-svg-Rc

全部标签

html - 如何在主窗口中打开嵌入式 SVG 文件中的链接,而不是在单独的对象中

我有一个包含URL链接的SVG文件(由Graphviz生成)。我希望这些链接可以点击。首先我尝试了显示图像正常但链接不可点击。更改为对象:使链接可点击,但当用户点击它们时,新页面会在对象内打开。有什么方法可以让链接在主窗口中打开?这是使用firefox5.0,但如果您知道任何跨浏览器差异,我将不胜感激! 最佳答案 首先,如果您将SVG嵌入为,浏览器不会打开链接,也不会在中运行脚本,因为,好吧,你嵌入了一张图片,你的图片很可能会出现在中。,并且您不能将链接放在链接中。要在新标签页中打开链接,您可以使用target属性,如HTML或特定

html - AngularJS ng-href 和 svg xlink

我想要一些关于在angular中使用xml命名空间属性的信息。问题是当Angular解析了表达式时,angular附带了一些指令来处理写入属性,例如href和src(否则浏览器将尝试加载{{mymodel.myimage}}作为网址)https://github.com/angular/angular.js/blob/master/src/ng/directive/booleanAttrs.js#L329我面临的问题是我使用angular与D3一起输出svg,因为angular没有办法输出xlink:href我被卡住了。我创建了一个输出xlink:href的自定义指令app.direc

html - 除非是纯文本,否则 SVG foreignObject 内容不会显示

我正在尝试使用SVG绘图中的foreignObject标签输出HTML。我正在使用d3生成元素。只有当foreignObject标签内的内容是纯文本时,才会显示foreignObject标签内的HTML内容,否则它只会显示为空/空白。请参阅此jsfiddle以获取我的问题示例:http://jsfiddle.net/R9e3Y/29/检查元素时会显示foreignObject标签内的内容:test但在屏幕上不可见?如何让内容显示出来? 最佳答案 因为您使用的是d3,所以您需要告诉d3该div是一个htmldiv,而不是svg命名空间

html - 在包含 SVG 标记元素的页面上使用基本标记无法呈现标记

我在尝试在基于SVG的可视化中使用SVG标记元素时遇到了问题。我正在将我的更改添加到Web应用程序中,该应用程序恰好在每个页面上都包含一个基本标记,因此对CSS文件、javascript文件等的任何引用都可以是相对的。我在下面有一些示例代码可以重现该问题。定义了一个线元素和一个标记元素。标记元素由其“marker-end”属性中的行通过标记的uri和id引用。没有base标签,箭头显示正常。使用基本标签,它不会显示。原因是因为base标记改变了浏览器解析url的方式..即使对于在该行的marker-end属性中指定的简单的基于id的url也是如此。有什么办法可以解决这个问题而不必删除基

html - 我可以将部分 HTML 页面导出为 SVG 图像吗?

我需要维基百科导航框的矢量图。不幸的是,Inkscape无法打开HTML文件,Opera和Chromium也无法将页面保存为SVG。谷歌搜索,谷歌搜索,再谷歌搜索一无所获;特别是,“HTML2svg”似乎意味着HTML“与”其中的SVG图像“对话”的功能。有人如何将HTML转换为SVG,无论是整个页面还是页面上的一个div?我需要样式化的HTML、CSS和所有内容。 最佳答案 我遇到了同样的需求,并找到了以下免费实用程序,它们有望实现这一点:WebVector是一个HTML到SVG或PNG的转换器。它将HTML文档转换为SVG格式的

html - 我可以将 HTML 嵌入到 HTML5 SVG 片段中吗?

HTML5支持标签,允许将SVG嵌入到HTML中。再深入一点,我可以在中嵌套一些HTML吗?分段?例如,我想放置一个CSS编码的在我的SVG图形的某些部分。我做了一个小测试,Chrome12不喜欢HTML在里面.是否有一些技术可以使其工作(例如html容器标签?)? 最佳答案 是的,用元素,参见thisquestion举一些例子。或者,如果您有一个html5文档,您还可以使用CSS定位和z-index使部分html在您想要放置在svg之上的位置可见。如果你这样做,你不需要将html嵌套在svg片段中。根据我的经验,这将为您提供跨浏览

html - SVG 图标不工作

我想在我的网站上添加一个SVGFavicon,但无论我做什么,它都不起作用。我已将以下代码保存为.svg文件并保存在我常用的网站图标位置,但是当我将网站图标路径更改为.svg而不是.ico时,没有加载任何内容。.shape1{fill:#DB6B2A;}.shape2{fill:#AE1A31;}这是我用来设置网站图标的代码;我不知道是我的.svg代码有问题,还是我遗漏了什么。谢谢 最佳答案 Firefox、Chrome、Edge和Opera现在支持SVG图标:https://caniuse.com/#feat=link-icon-

html - 将 SVG 缩放到没有蒙版/裁剪的容器

我已经尝试了svg参数的多种变体,但对缩放这个特定的SVG并不满意。我正在尝试包含thisSVG放入控制SVG大小的容器元素中。我的目标是500x309像素。width、height、viewBox和preserveAspectRatio的什么组合可以帮助我在没有SVG的情况下实现这一目标蒙版还是裁剪? 最佳答案 你绝对必须有一个viewBoxSVG元素上的属性,用于描述您希望始终可见的内容的边界框。(您链接到的文件没有;您需要添加一个。)要使您的SVG填充HTML元素,请放置CSS属性position:relative(或posi

html - 如何将颜色应用于 SVG 文本元素

好吧……我要疯了。我已经开始尝试使用SVG。使用SVG并将CSS类应用到它就像一种魅力。我只是不知道我做错了什么,但我只是无法让类(class)在svg文本元素上工作。我已经把它全部剥离了,这就是我得到的:Playground.mainsvg{height:320px;border:1pxsolidred;width:400px;}.caption{color:yellow;}SVG-SandboxFact根据http://www.w3.org/TR/SVG/styling.html#ClassAttribute这应该工作...关于更改内容或替代方案的任何提示/技巧?

html - 从 Font Awesome 中提取 SVG

我想从FontAwesome获取SVG路径数据字形,以便我可以在我的HTML中直接将它们用作SVG。我认为这就像从fontawesome-webfont.svg复制粘贴路径数据一样简单,但是当我在我的HTML中使用它时,所有的符号都是颠倒的。有人知道为什么吗?(参见Fiddle)FontAwesomeSVG:...移植到HTMLSVG(并按比例缩小): 最佳答案 更新2022感谢ChrisAelbrecht下面的评论:官方repo有最新版本的SVG可供下载https://github.com/FortAwesome/Font-Awe