草庐IT

svg_filedata_cache

全部标签

javascript - 组件重新渲染时 React SVG 消失

我正在用我的组件中的一些SVG图标制作一个React应用程序。例如,我有一个SearchBar组件,其中包含输入元素以及一个带有搜索图标的按钮。我通过从单个sprite文件相应地设置xlinkHref属性,为我的所有SVG图标使用内联SVG。一切似乎都运行良好,除了我的SVG图标在我点击它们时随机消失。包含图标的按钮元素不会消失,只是SVG图标。我检查了devtools上的DOM树,似乎名为“#shadow-root”的节点存在问题。当我的SVG图标可见时,它们被放置为“#shadow-root”的子节点。然而,当它们消失时,DOM树显示“#shadow-root”节点不再有任何子节点

javascript - 如何在Edge和IE中点击SVG形状实现动画

ThisquestioncanalreadybesaidnotrelevantMicrosoftEdge-ChromiumInsider同学们,我知道两种动画方式。这两个选项都适用于我可以访问的所有浏览器;我没有只检查Safari。第一个是使用函数elem.beginElement();varwrapper_svg_1=document.getElementById("wrapper_svg_1"),close=document.getElementById('close'),open=document.getElementById("open");letflag=true;wrapp

javascript - 将 SVG 文本裁剪到 D3 TreeMap 中矩形的宽度

我想知道是否有比使用剪辑路径更简单的方法来限制文本标签的宽度。这是我正在寻找的有关标签的示例:treemap:请注意,标签被包含图block的边界chop了。该特定示例是使用实现的标签,默认情况下具有此行为。但我正在使用SVG我希望有比定义另一个矩形的单独剪辑路径更直接的方法。 最佳答案 您可以将每个包装起来中的元素相同宽度/高度的元素。默认overflow隐藏在内部元素。 关于javascript-将SVG文本裁剪到D3TreeMap中矩形的宽度,我们在StackOverflow上找到

javascript - 动态生成的 SVG 的高分辨率打印输出

我有一个网页,它是一个动态生成的SVG文档。Javascript例程基本上构建了SVG的DOM。读者可以通过单击导致sVG更改的各种“按钮”或对象来操作文档。(虽然没有动画)我希望读者能够打印出文档的大格式、高分辨率图像。我怎样才能做到这一点?通常,文档会被缩放和裁剪以适应屏幕。我可以生成一个巨大的图像,但是浏览器会裁剪它。为了理解我所说的高分辨率是什么意思,屏幕图像通常为每英寸89像素,可能为11x16"左右。在36英寸宽的纸上,大格式图很容易达到每英寸600像素。我无法弄清楚如何生成这样的打印输出。有没有办法可以从动态生成的DOM生成状态SVG标记文档?如果是这样,我可以将静态SV

javascript - 使用 <symbol> 编写 SVG 脚本

我正在尝试在JS中创建一个SVG元素,然后将其附加到DOM。SVG元素引用了一个符号。我可以使用insertAdjacentHTML方法实现这一点,但不能通过appendChild方法实现。当使用appendChild时,根据浏览器检查器,所有正确的东西都在DOM上,但没有正确呈现。谁能看出原因?http://codepen.io/bradjohnwoods/pen/dGpqMb?editors=101varbtn=document.getElementById('btn');//varmyString='';//btn.insertAdjacentHTML('afterbegin',

javascript - 在 node.js 服务器上更改 svg 中文本元素的内容

我在Node/快速服务器上使用svg.js以及svgdom来尝试管理svg,然后将其转换为PNG以构建PDF。目前,我已经做到了这一点constwindow=require('svgdom');constSVG=require('svg.js')(window);constdocument=window.document;constdraw=SVG(document.documentElement);constfs=require('fs');consttag=fs.readFileSync(`images/name-tag-1-with-name.svg`,'utf8');const

javascript - 最佳基于 Web 的 SVG 所见即所得

我有一个需要绘图程序的站点。我的用户需要能够绘制平面图并向这些图像添加文本。我想知道是否有人遇到过不错的SVG所见即所得编辑器。否则我将不得不使用我不喜欢的Flash或Java应用程序。 最佳答案 我唯一知道的是svg-edit.它远不如CKEditor、TinyMCE或FCKEditor等编辑器在其应用领域中强大或成熟,实现起来也不会那么简单,因为它更像是一个脚本,就像一个组件,最后我不知道定制它是多么容易。但我非常怀疑是否有类似的东西更舒适。你可以试试here或here(顺便提一下,它不能在InternetExplorer中运行

javascript - 使用 SVG 作为渲染器的 GUI 库?

按照目前的情况,这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持,但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开,visitthehelpcenter指导。关闭9年前。我最近不得不用SVG(基于Dojo)实现一些小部件,例如Button、Checkbox、Toggle-Button,现在我面临着更多的小部件:组合框、列表等等。结果给我留下了深刻的印象,尤其是小部件的精度,在所有浏览器中都能正常工作。与使用jQuery和friend完成的经典GUI实现相比,这对我来说是一个巨大的不同......那时候周围什么都没有,我很好

javascript - outerHtml 在 IE 中为 SVG 元素返回 undefined

这是我的代码我在b上触发了鼠标移动事件$("#b").hover(function(){alert($(this)[0].outerHTML);});这在chrome中工作但在IE中不工作我该如何解决..请找到JSFiddle链接:http://jsfiddle.net/r8v70Lnk/警告框只会在chrome中显示,在IE中不会显示。 最佳答案 不知道这是否适合您,但我通常这样做:newXMLSerializer().serializeToString(document.querySelector('#b'))如果你想再次解析字

javascript - 将 Raphael JS 在 Canvas 中生成的 SVG 保存为 png 时出现问题

我正在尝试转换RaphaelJS生成的SVG(和用户,因为您可以拖动和旋转图像)。我跟着这个ConvertSVGtoimage(JPEG,PNG,etc.)inthebrowser但仍然无法获取。这一定很简单,但我不能指出我做错了什么。我将我的svg放在一个div中,#ec作为id,Canvas的是#canvas。functionsaveDaPicture(){varimg=document.getElementById('canvas').toDataURL("image/png");$('body').append('');}$('#save').click(function(){