草庐IT

mermaid-svg-Rc

全部标签

javascript - 将 svg 转换为 png 时添加 css 样式

我有以下问题:我正在转换由d3.js创建的svg图,但png与svg完全不同。转换前的SVG转换后的PNG:如何将相同的.css代码应用于转换?有没有像创建svg时那样链接到.css文件?svgtopng.js代码:d3.select("#save").on("click",function(){varhtml=d3.select('#h3svg').attr("version",1.1).attr("xmlns","http://www.w3.org/2000/svg")//HEREIWASTRYINGWITH.stylebutIwanttolinkallthecssclassesf

javascript - 将 svg 转换为 png 时添加 css 样式

我有以下问题:我正在转换由d3.js创建的svg图,但png与svg完全不同。转换前的SVG转换后的PNG:如何将相同的.css代码应用于转换?有没有像创建svg时那样链接到.css文件?svgtopng.js代码:d3.select("#save").on("click",function(){varhtml=d3.select('#h3svg').attr("version",1.1).attr("xmlns","http://www.w3.org/2000/svg")//HEREIWASTRYINGWITH.stylebutIwanttolinkallthecssclassesf

html - 在 IE Edge 中不考虑 SVG 转换属性

下面的JSFiddle是一个SVG绘图,有2个棕色矩形彼此间隔并且有一个组有一个类class="group"应用转换(旋转和平移)。JSFiddle引用Caniuse.com,主要浏览器支持率最高,说明IE9+支持SVGtransform属性,在Knowissues上说:IE10andbelowdoesnotsupportCSStransformsonSVGelements(thoughSVGtransformattributesdowork).问题尽管我唯一的来源是这个网站,但我知道我们是否能弄清楚为什么IEEdge此时(2015年12月)不支持转换属性?问题2是否有任何替代方法来应

html - 在 IE Edge 中不考虑 SVG 转换属性

下面的JSFiddle是一个SVG绘图,有2个棕色矩形彼此间隔并且有一个组有一个类class="group"应用转换(旋转和平移)。JSFiddle引用Caniuse.com,主要浏览器支持率最高,说明IE9+支持SVGtransform属性,在Knowissues上说:IE10andbelowdoesnotsupportCSStransformsonSVGelements(thoughSVGtransformattributesdowork).问题尽管我唯一的来源是这个网站,但我知道我们是否能弄清楚为什么IEEdge此时(2015年12月)不支持转换属性?问题2是否有任何替代方法来应

javascript - 如何在 svg 的 <g> 标签中获取内部标签?

我正在使用SVG使用JavaScript的标签。我需要在每个rect中获取内部标签(例如:path、等)标签。这是我用来获取特定标签的内容。varstess=selectedElement.getElementsByTagName('rect');console.log(stess);但我也有动态标签。我应该如何检索内部标签的值?更重要的是,如何更改这些内部标签的宽度?这是我试过的代码:$('.test').change(function(){console.log(selectedElement.children());//ResultsError}我最终记录了.我应该如何进行?

javascript - 如何在 svg 的 <g> 标签中获取内部标签?

我正在使用SVG使用JavaScript的标签。我需要在每个rect中获取内部标签(例如:path、等)标签。这是我用来获取特定标签的内容。varstess=selectedElement.getElementsByTagName('rect');console.log(stess);但我也有动态标签。我应该如何检索内部标签的值?更重要的是,如何更改这些内部标签的宽度?这是我试过的代码:$('.test').change(function(){console.log(selectedElement.children());//ResultsError}我最终记录了.我应该如何进行?

html - SVG 元素上的 CSS 过渡和转换

我目前正在尝试使用CSS变换旋转一个SVG组,并使用CSS过渡对其进行动画处理。我得到了所需的转换,但没有得到动画,知道问题出在哪里吗?内联SVG代码指南针SCSS.hub-icon-container{@includetransition(all0.5sease-in-out);&:hover{.hub-icon{transform:rotate(180deg);transform-origin:50%50%;-ms-transform:rotate(180deg);-ms-transform-origin:50%50%;-webkit-transform:rotate(180deg

html - SVG 元素上的 CSS 过渡和转换

我目前正在尝试使用CSS变换旋转一个SVG组,并使用CSS过渡对其进行动画处理。我得到了所需的转换,但没有得到动画,知道问题出在哪里吗?内联SVG代码指南针SCSS.hub-icon-container{@includetransition(all0.5sease-in-out);&:hover{.hub-icon{transform:rotate(180deg);transform-origin:50%50%;-ms-transform:rotate(180deg);-ms-transform-origin:50%50%;-webkit-transform:rotate(180deg

html - 为什么 svg <use xlink :href ="#"/> referencing an element with clip-path not work?

在实现SVGSprite时,创建元素并通过引用svg元素元素。含然后使用style="display:none;"隐藏元素clip-Path属性不呈现,但路径呈现。这让我的道路看起来与我想要的不同。我如何使用svg引用带有剪辑路径的元素?我使用grunt-svg-store来创建我的svgsprite,但已将此示例简化为问答格式https://css-tricks.com/svg-sprites-use-better-icon-fonts/byIDwithUse-->LiveexampleonCodepen.io 最佳答案 使用而不

html - 为什么 svg <use xlink :href ="#"/> referencing an element with clip-path not work?

在实现SVGSprite时,创建元素并通过引用svg元素元素。含然后使用style="display:none;"隐藏元素clip-Path属性不呈现,但路径呈现。这让我的道路看起来与我想要的不同。我如何使用svg引用带有剪辑路径的元素?我使用grunt-svg-store来创建我的svgsprite,但已将此示例简化为问答格式https://css-tricks.com/svg-sprites-use-better-icon-fonts/byIDwithUse-->LiveexampleonCodepen.io 最佳答案 使用而不