草庐IT

flutter_svg

全部标签

javascript - 如何在 OpenLayers-3 上使用 SVG 图像作为图层

如何使用OpenLayers-3将SVG图像用作图层(而不是map标记)在使用任何ol.source.Vector和ol.format.Feature实例时,我无法获得我的SVG图像的任何输出。小例子:varmapLayer=newol.layer.Vector({source:newol.source.Vector({url:'image.svg',format:newol.format.Feature()//http://openlayers.org/en/v3.12.1/apidoc/ol.format.Feature.html}),});我在使用ImageStatic层时能够获

javascript - 是否可以在 SVG 中监听图像加载事件?

是否可以监听SVG中的加载事件?如果是,该怎么做? 最佳答案 是的,这是可能的。在标记中:参见jsfiddle.在脚本中:varimg=document.createElementNS("http://www.w3.org/2000/svg","image");img.addEventListener('load',function(){alert('loaded');});//oralternatively://img.onload=function(){alert('loaded');}img.width.baseVal.val

javascript - 求SVG+Javascript框架的好的解决方案

关闭。这个问题不符合StackOverflowguidelines.它目前不接受答案。我们不允许提问寻求书籍、工具、软件库等的推荐。您可以编辑问题,以便用事实和引用来回答。关闭6年前。Improvethisquestion我期待听到其他人使用SVG+Javascript框架的经验。我希望框架处理的事情-DOM创建、事件处理和最小尺寸。JquerySVG插件-http://keith-wood.name/svg.html似乎是我唯一能找到的。

javascript - 如何将 <image> 元素添加到 SVG DOM

我有一个带有jpg图像的网页,用户在使用Raphael的基础上绘制了SVG涂鸦。我想允许用户在完成后保存合并的光栅化版本(我将自己用SVG版本做其他事情)当用户单击保存时,我想将该背景图像作为元素添加到生成的SVGDOM中,然后使用canvg将SVG写入Canvas元素。最后,我使用toDataUrl()方法将其转换为jpg。我无法让中间位工作—将图像添加到DOM的最佳方式是什么?当我使用下面的代码时,我收到一个javascript错误,提示appendChild()不是一个函数。我想知道这是否与我使用.html()方法获取SVG的方式有关——也许返回的内容没有被解释为真正的SVG文档

javascript - 将 SVG 路径 d 属性转换为点数组

当我可以创建一行时:varlineData=[{"x":50,"y":50},{"x":100,"y":100},{"x":150,"y":150},{"x":200,"y":200}];varlineFunction=d3.svg.line().x(function(d){returnd.x;}).y(function(d){returnd.y;}).interpolate("basis");varmyLine=lineEnter.append("path").attr("d",lineFunction(lineData))现在我想向此lineArray的第二个点添加文本:lineE

javascript - 无法在 Google map 符号 (svg) 标记中填充颜色

我正在使用Googlemap符号作为我map的标记。具体来说,我正在使用预定义的Circle符号。然而,圆圈从内部看起来是空心的。fillColor被忽略,但strokeColor有效。Isitpossibletofillthecirclewithcolor?varmarker=newgoogle.maps.Marker({position:myLatlng,icon:{path:google.maps.SymbolPath.CIRCLE,scale:4,strokeWeight:2,fillColor:colors[parseInt(idx)],strokeColor:colors[

javascript - 如何为 svg 路径的渐进式绘图设置动画?

我想仅使用带有svg/canvas和jsmaximum的css为线条的渐进式绘图设置动画。可以找到我想画的线的想法hereLayer1 最佳答案 此答案中列出了三种技术:有一个全SVG解决方案,涉及逐步修改形状的stroke-dasharray以绘制越来越长的“破折号”,然后是一个巨大的间隙。演示:http://phrogz.net/svg/progressively-drawing-svg-path-via-dasharray.html相关代码:vardistancePerPoint=1;vardrawFPS=60;varorig

javascript - d3.js - 当鼠标悬停在 SVG 容器上的这些元素上时,如何将光标设置为手?

我已经使用d3.js在SVG容器上绘制了一些圆圈。我已经成功地在这些圆圈上设置了鼠标悬停行为以打印简单的控制台消息。我在鼠标悬停(和鼠标移出)时看到这些控制台消息,所以我知道它们工作正常。但是,我不想打印控制台消息,而是想在将鼠标悬停在上面时将光标更改为手,并且在鼠标移开时将光标更改回正常的箭头。鉴于我的代码如下,我该怎么做?在鼠标悬停时,我知道我需要将样式属性cursor更改为pointer,在mouseout时,我知道我需要将其更改为default但我不知道我应该怎么做的语法。有人可以向我解释一下吗?下面是我的代码。varmyCircle=svgContainer.selectAl

javascript - 使用 Raphaël JS 和 SVG 调整扇区路径大小的更优雅的方法?

我正在使用Raphaël第一次没有svg经验,我需要真正了解这两者的人来帮助我。我创建了一个包含动态扇区的饼图。可以通过拖动圆形按钮来调整扇区的大小。参见thisfiddle.我只在Chrome和Safari中测试过,它们是唯一需要的浏览器。饼图尚未完成。扇区可以重叠。请暂时忽略它。当一个扇区的起始Angular大于结束Angular时,我遇到了问题。当结束Angular超过0/360°标记时就是这种情况。为了解决这个问题,我使用了路径-旋转-参数。我将扇区向前移动,同时将Angular向后移动,直到结束Angular为360。您可以在此函数的fiddle中看到:functionsec

javascript - 如何在 IE 11 的 Image.load 上获取 SVG 的宽度和高度

它在任何地方都可以正常工作,但在IE11中不行(我还没有测试过其他IE版本)。varimg=newImage();img.onload=function(){alert('img:'+img.width+'x'+img.height+'natural:'+img.naturalWidth+'x'+img.naturalHeight);};img.src='http://upload.wikimedia.org/wikipedia/en/b/b5/Boeing-Logo.svg';JSFiddle:JSFiddle结果:img:121x30natural:121x30-真正的浏览器(Ch