Tag: svg

如何使用jQuery / Javascript旋转单个SVG元素？: 我有一个重复的矩形形状的SVG。在滚动时，每个矩形应单独旋转。我遇到的问题是整个SVG块旋转，而不是单独旋转。是否可以将脚本定位为将每个矩形视为要旋转的单个元素？这是我的： JSFiddle 这是我在某处找到的旋转解决方案，但它会影响整个SVG： $(function() { var sdegree = 0; $(window).scroll(function() { sdegree ++ ; sdegree = sdegree + 2 ; var srotate = “rotate(” + sdegree + “deg)”; $(“rect”).css({“-moz-transform” : srotate, “-webkit-transform” : srotate}); }); });

错误：使用getBBox（）时firefox中的NS_ERROR_FAILURE: 我想使用方法getBBox（）来获取SVG中创建的元素的宽度和高度在这里，我提供了我的代码，它给出了chrome但不是firefox的结果请帮我解决一下.. try { console.log(document.getElementById(“rect1”).getBBox()); console.log(document.getElementById(“rect2”).getBBox()); } catch (e) { console.log(e); } svg { border: 1px dashed blue; } #rect2 { display: none; }

在hover时修改SVG路径: 我想在hover时更改svg路径坐标，我可以不使用D3js吗？ SVG是我在sketchapp上制作的一种图形，这里是代码：我想要做的是图表在hover时平滑过渡。该图表将作为封面放在标题上。谢谢！

通过mousemove / touchmove bug进行SVG角度旋转: 我想用一个点指针通过mousemove / touchmove旋转svg循环。我尝试了很多js脚本（例如Touchy Wheel Demo和Rotate Dial Demo ），他们的例子很完美，但是当我尝试我的例子时，我总是看到两个bug：旋转仅在圆形的下部，顶部 – 它反向旋转。旋转工作非常缓慢（在演示轮中强烈跟随鼠标/手指）。我的演示： https ：//jsfiddle.net/0L87uabc/8/（请看之前如何在作者的演示页面上工作）此外，我尝试这个简单的例子-result类似于上面： var dragging = false $(function() { var circles = [‘circle-l1’, ‘circle-l2’, ‘circle-l3’, ‘circle-l4’, ‘circle-l5’, ‘circle-l6’, ‘circle-l7’]; $.each(circles, function(ind, val) { var target = $(‘#’+val) target.mousedown(function() { dragging = true }) $(document).mouseup(function() { dragging = false }) target.mousemove(function(e) { […]

如何知道svg路径上是否有任何x或y点: 我有一个svg路径，我想知道我的鼠标是否在svg路径上，如果它是我想将光标更改为鼠标指针。这可以通过在路径上添加鼠标hover属性并且使用识别点（x，y）在svg路径内或使用此解决方案外部来轻松完成。但有一个扭曲，我有另一个透明层，因为我不能有这两个解决方案。现在我正在制作顶层显示无，它工作正常。但是因为这个我的鼠标指针和我做的动作，比如在鼠标移动时移动某个元素很慢，因此我想知道是否有任何其他更好的方法，而不使显示等于没有。请找到小提琴示例，我想将光标更改为指针，当它在mypath元素上时也希望myline应该移动，因为我将鼠标移动到图层上，我可以暂时在图层上显示无，但我注意到了火狐，线条运动不是那么顺畅， https://jsfiddle.net/shyam_bhiogade/9a7zuou2/6/

有人可以评论我的错误修复吗？: 我一直在使用Twitter的Bootstrap Tooltip插件。除了在svg元素上使用时，它会完全正常工作。经过一些调试，我缩小了问题范围。在js文件中， init函数如下所示： , init: function (type, element, options) { var eventIn , eventOut … if (this.options.trigger != ‘manual’) { eventIn = this.options.trigger == ‘hover’ ? ‘mouseenter’ : ‘focus’ eventOut = this.options.trigger == ‘hover’ ? ‘mouseleave’ : ‘blur’ this.$element.on(eventIn, this.options.selector, $.proxy(this.enter, this)) this.$element.on(eventOut, this.options.selector, $.proxy(this.leave, this)) } … } 我记得SVG-IE 9.0的具体实现存在很多问题，所以我做了以下修改： […]

代码在JSFiddle和Codepen中工作，但在浏览器中没有，我哪里出错了？: 下面的代码运行有什么问题？它在JSFiddle和Codepen中运行，所以我不明白它为什么不能在浏览器中作为网页工作。我看到有关jQuery和SVG之间不兼容的事情，但是为什么它在JSFiddle和CodePen中工作，如果是这样的话。他们不是像运行普通网页一样运行代码吗？的jsfiddle CodePen Check Value $ var numArray = []; $(“#blackC”).on(“click”, function () { if ($.inArray(“7”, numArray) == -1) { numArray.push(“7”); } }); $(“#blueC”).on(“click”, function () { if ($.inArray(“1”, numArray) == -1) { numArray.push(“1”); } }); $(“#greenC”).on(“click”, function () { if ($.inArray(“2”, numArray) == -1) { numArray.push(“2”); } }); $(“#greyC”).on(“click”, function () […]

jQuery mobile如何干扰我的鼠标/触摸SVG文档？: 我有一个使用我自己的SVG按钮方法的应用程序，这需要一些hackery上class，但我喜欢它是如何工作的。但是，当我将jQuery Mobile添加到项目中时，我的按钮不再响应点击或触摸。我的按钮不是元素，而是链接外部SVG文件的标签。我有代码来解决这些问题： function buttonifySVG(id, clickHandler) { var obj = document.getElementById(id); var svgDoc = obj.getSVGDocument(); function addClickHandler() { svgDoc.removeEventListener(‘touchstart’, clickHandler); svgDoc.removeEventListener(‘mousedown’, clickHandler); svgDoc.addEventListener(‘touchstart’, clickHandler); svgDoc.addEventListener(‘mousedown’, clickHandler); } addClickHandler(); obj.addEventListener(‘load’, addClickHandler, false); } 这是一个示例“按钮”：而且要完全清楚： … buttonifySVG(‘stepForward’, function() { doTheThing(); }) 我可以通过日志记录确认按钮仍然被此代码连接，但传入的clickHandler永远不会被调用。除此之外，在jquery-mobile.js中浏览，看起来至少有一个地方点击并停止点击，但我不知道什么时候，更重要的是，我宁愿不开始破解jquery代码让事情发挥作用。谁能告诉我这可能是什么问题？如果我知道这里发生了什么，我可能会破解它。另外，jQuery Mobile是否对元素做了什么特别的事情？这种方法有很多很好的function，我真的很想让它与jQuery Mobile一起发挥 – 我正在寻求的解决方案是不要用jQuery SVG图标按钮替换我的智能按钮（虽然我打算将其用于其他UI的一部分）。谢谢你的帮助！

滚动时如何填充svg: 我有svg行：我需要在滚动页面时逐渐填充不同的颜色。怎么做？

getElementsByTagName（…）。0.parentNode’为null或不是对象: 我正在为我的应用程序使用Google Chart，我必须将生成的图表转换为图像字节代码。我在Firefox和Chrome中做过这个，但IE8没有响应获取svg元素，所以现在我不能从给定的div元素中获取字节代码。我将将div元素转换为字节代码的脚本如下所示 function getElement() { for (var i = 0; i < divelement.length; i++) { toImg(document.getElementById(divelement[i]), i, medicalconditionid[i]); } } function toImg(chartContainer, i, id) { var field = document.createElement("input"); field.type = "hidden"; field.id = "img_code" + i; field.name = "imgcode"; document.getElementById("dynamicText").appendChild(field); document.getElementById('img_code' + i).value = id + "_" + getImgData(chartContainer); i++; […]