草庐IT

svg-baker-runtime

全部标签

javascript - SVG 圆形描边原点

我在描述问题时遇到了问题,但这里是:我正在尝试制作一个SVG圆圈进度条,我找到了一个完美的例子,说明我想在没有任何第三方库(如snap)的情况下做的事情:http://codepen.io/JMChristensen/pen/Ablch问题是我在更改笔划原点方面遇到了实际问题。如果您尝试一下,您会注意到,原点位于右侧。我需要它来自顶部。现在,我是一名开发人员,所以我已经尝试过自己,但我终究无法弄清楚如何去做。如果我更改stroke-dasharray属性,笔划将与stroke-dashoffset中设置的百分比不匹配。我明白这一切都归结为stroke-dasharray值的数学运算,但

javascript - 为什么不显示 SVG 使用用 JavaScript 创建的元素?

我的文档中有一个SVG,我用JavaScript向它添加了一个符号,如下所示:varmyScene=document.getElementById('myScene');varuseSVG=document.createElement('use');useSVG.setAttribute('xlink:href','spriteSheet.svg#mySymbol');useSVG.setAttribute('x','10');useSVG.setAttribute('y','30');useSVG.setAttribute('width','10');useSVG.setAttrib

javascript - 通过 JS 在 svg 中添加图像命名空间仍然没有显示图片

在通过图片的缩放版本获取参数后,我尝试通过Javascript在SVG中添加具有原始尺寸参数的图片。Firebug向我展示了元素和所有必要的参数,但祝我好运,我没有通过。this.svg=document.getElementsByTagNameNS('http://www.w3.org/2000/svg','svg');varbild=document.createElementNS('http://www.w3.org/2000/svg','image');varBildURL=this.image[0][0].getAttribute('xlink:href');varimgX=

javascript - 动态创建的 SVG 元素不显示

我正在尝试使用纯JavaScript绘制一个SVG矩形。它没有显示。但是当我在浏览器控制台中运行document.getElementById('rect1')时,矩形元素存在。当我将控制台中的HTML复制并粘贴到HTML文件中时,矩形会正确显示。所以看起来好像正确的代码被添加到文档中,但是元素没有被显示。HTML:-->JavaScript:functionaddSvgElement(){varrect=document.createElement("rect");rect.setAttribute('x',30);rect.setAttribute('y',60);rect.set

javascript - d3 和 svg 中的自定义上下文菜单

我希望在右键单击svg圆圈时显示自定义上下文菜单。现在我找到了this使用以下代码帮助我处理右键单击的答案:.on("contextmenu",function(data,index){//handlerightclick//stopshowingbrowsermenud3.event.preventDefault()});现在我想知道如何显示包含一些HTML的框。提前致谢。 最佳答案 d3.select('#stock_details.sym').on("contextmenu",function(data,index){varp

javascript - 使用 Snap.svg 创建多行文本

我无法弄清楚如何在Snap.svg中使用单个paper.text元素创建多行文本。我已经尝试使用针对raphael.js提到的技术,例如\n,但这对snap.svg没有任何作用。我尝试过使用、\n及其变体,但没有任何效果。我觉得很奇怪,在raphael.js中很容易做到(在文档中),但是snap.svg文档没有提到任何相关内容,并且在网上搜索我什么也没发现。不胜感激,谢谢!http://jsfiddle.net/f3mkqovm/varmyRect=paper.text(100,100,["Lorem","","ipsumdolorsit\namet/nsee","\n","amend

javascript - 可以将文本添加到 SVG 路径吗?

是否可以将文本添加到svg路径,我创建了一个svg三Angular形并想在其中心添加一个字母但不确定这是否可能? 最佳答案 是的。参见section10.13oftheSVG1.1specification(标题为“路径上的文本”)以获取有关使用textPath的信息元素。总结:给你的路径一个id属性。创建Mytexthere这是一个直接来自规范的例子:Exampletoap01-simpletextonapathWegoup,thenwegodown,thenupagain 关于jav

javascript - 使用 SVG 或 WebGL 的 3D 形状

您好,我想在浏览器中渲染一个交互式3D球体。它上面的纹理将是一张世界地图,所以基本上我试图创建一个可以使用map在任何方向旋转的地球仪。我很擅长使用SVG渲染2D图像,但不确定如何在SVG中渲染3D形状。是否可以在SVG中渲染3D形状,如果可以,如何渲染?如果不是,WebGl是更好的选择吗? 最佳答案 看看three.js它对实现进行了一些抽象(带有WebGL/SVG/Canvas后端)。SVG是一种2d矢量图形格式,但您可以将3d形状投影到2d上,因此可以使用SVG渲染3d对象,这只是一些工作(最好留给javascript库)。

javascript - Autocad .dwg 到 SVG 到 PolyMap 的瓷砖,从而产生事件平面图

我目前正在将.dwg文件另存为.dxf,在Illustrator中打开,另存为.svg,然后使用Polymaps将其嵌入到html文档中.期望的结果是制定事件平面图。平面图超过1,000,000平方英尺,所以我相信平铺是拥有可用于移动设备的东西的唯一方法(由于加载时间)我无法找到有关如何从SVG文件创建图block然后将它们与Polymaps一起使用的任何信息。我对此不熟悉,所以尽管我已经完整阅读了Polymaps文档,但我不确定即使在拥有这些图block后我是否能够实现。如果有任何有关从可与Polymap一起使用的.svg创建图block的资源,以及有关使用Polymap的更详细的示

javascript - 将 SVG 和 .JPG 合并为一张图像?

我有一个在map应用程序中使用SVG/VML(通过RaphaelJS)设置的网站,其中SVG用于在背景map图像上显示图形。这在屏幕上非常有效,也适用于打印带有叠加层的硬拷贝map。然而,当用户想要将带有SVG叠加层的map图像保存到本地.JPG文件时,此设置就会崩溃。更具体地说,当图像顶部有SVG/VML元素时,使用大多数浏览器的标准右键单击功能“将图像另存为...”不起作用。右键单击map,用户可以保存map图像,但没有叠加层。右键单击覆盖的SVG元素,用户获得的最好结果是能够检查元素或保存一些HTML(因浏览器而异)。所以我的主要问题是;是否可以拍摄一张图像和一个SVG元素并将它