草庐IT

svg_filedata_cache

全部标签

javascript - 如何通过签名 URL 在 S3 对象上定义 Cache-Control header ?

按照thisguide中的说明进行操作,我已经设法让上传通过签名的URL工作。它看起来像这样:consts3=newaws.S3();consts3Params={Bucket:S3_BUCKET,Key:fileName,Expires:60,ContentType:fileType,ACL:'public-read',CacheControl:'public,max-age=31536000',};s3.getSignedUrl('putObject',s3Params,(err,data)=>{//...});...除了我的CacheControl参数(我自己添加;它不在指南中)

javascript - svg Canvas 内的原生按钮标签

我需要在SVGCanvas中放置一个按钮标签,有什么办法吗?(我正在使用拉斐尔JS)我知道我可以在svgCanvas内“绘制”一个按钮并编写onclick事件代码,但我想保留浏览器按钮的原生外观和感觉。谢谢你。 最佳答案 可以在SVG中使用HTML按钮,使用SVGforeignObject元素:http://www.w3.org/TR/SVG/extend.html#ForeignObjectElement规范中包含如何使用它的示例。不幸的是,我不确定如何最好地使用raphaeljs中的foreignObject。我相信foreig

JavaScript 和 SVG : how do you increase the clickable area for an onClick event?

我的脚本以3的stroke-width在屏幕上绘制线条。线条的大小(在视觉上)很理想,但它们不太容易点击。举个粗略的例子:functionselectStrand(evt){current_id=evt.target.getAttributeNS(null,"id");document.getElementById('main').innerHTML=current_id;}Selectedline:有没有一种简单的方法可以增加每条线周围的区域,使其更易于点击? 最佳答案 对于每条线,尝试在其上绘制一条具有更大笔划宽度的透明线,并在

javascript - 如何使用 javascript 克隆 SVG 元素?

我正在尝试按照示例here在cloneNode部分下(文档中第四次出现“cloneNode”)。该文件说这是一个草稿,所以我想知道这些功能是否还不存在于SVG中??这是我的HTML:varRoot=document.documentElementfunctionclone(){varG=document.getElementById("groupid")alert('hi')varNewG=G.cloneNode(true)alert('bye')varmove="translate("+0+","+30+")"NewG.setAttributeNS(null,"transform",

javascript - 如何获取 SVG tspan 元素的宽度

我正在尝试获取SVG中tspan元素(位于text元素内)的呈现宽度。这是我的标记:Value1Value2在视觉上,我希望值1向左浮动,而值2向右浮动,以便多个元素将这样对齐:Value1Value2Value10Value20Value100Value200Value1000Value2000因为我想要tpsan的宽度(“值1”/“值2”)而不是文本元素,所以我不能使用getBBox(),因为该方法不适用于tspan元素。奇怪的是,使用jQuery的width()方法将在Chrome中返回正确的值,但在Firefox中返回NaN。任何想法将不胜感激。 最

javascript - 在 G 标签中包装现有的 SVG 元素

这似乎是一个简单的问题,但我很难回答:Isitpossibleto"wrap"existingSVGshapesinanewSVGgtag(i.e.group)usingd3.js,.wrap()在jQuery中的工作方式?如果我只是“手动”创建一个新的g标签,那么我将如何将现有元素移动到该g中? 最佳答案 如果您将现有的DOM元素传递给append或insert,该元素(及其子元素)将从它们在DOM层次结构中的当前位置移动到您'刚刚插入它们。varstuffToBeWrapped=d3.selectAll(".stuff");st

javascript - 扩展原生 d3 组件(如 d3.svg.axis())的惯用方法是什么?

对于d3中的时间序列可视化,我想在轴上突出显示年份。我通过制作我自己的xAxis渲染器实现了这一点,它调用nativeaxis函数,然后实现我自己的自定义逻辑来格式化它渲染的刻度。我就是这样做的(seeworkingexampleonjsbin):xAxis=d3.svg.axis().scale(xScale)customXAxis=function(){xAxis(this);d3.selectAll('.tick',this).classed("year",isYear);};...xAxis.ticks(10);xAxisElement=canvas.append("g").c

javascript - 如何获取分组 svg 元素的全局坐标?

假设我有以下document(fiddle):如果我不知道rect元素在一个组中,我如何获取它的全局坐标? 最佳答案 其实有点难找。搜索SVGElement的方法会导致页面显示SVGElement没有方法!它实际上有很多方法,但它们是继承的:http://www.w3.org/TR/SVG/types.html#InterfaceSVGLocatable根据您的需要,您可以使用getCTM或getScreenCTM的结果来转换SVGPoint,从而了解您的元素在哪里:root=document.getElementById('roo

javascript - 如何使 SVG 元素的鼠标事件通过另一个元素向上冒泡?

我有一个D3折线图,我在图表“后面”放置了一个矩形。此矩形附加了一个鼠标事件,但问题是我的图表还有另一个矩形覆盖在图表“上方”,该图表也附加了事件。如何让较低的矩形鼠标事件在覆盖在顶部的较高矩形上方冒泡?非常感谢!我在这里创建了一个fiddle:http://jsfiddle.net/TnjCC/1/这是我的代码。查找“这是我需要将鼠标悬停在此处冒泡的位置”评论,以查看我想要冒泡哪个元素。vardata=[{"date":"1-May-13","close":58.13},{"date":"30-Apr-13","close":53.98},{"date":"27-Apr-13","c

javascript - 动画化 <Circle/> 的 react-native-svg 短划线长度

大家好,我正在尝试实现类似于:https://kimmobrunfeldt.github.io/progressbar.js的效果(圈出一个)在使用setNativeProps方法之前,我能够成功地为一些svg元素制作动画,但是这次我用破折号长度失败了,下面是一个演示当前行为的gif(圆圈从完整变为收到新Prop时半满):从本质上讲,我正在尝试为这个变化设置动画,而不是它只是轻弹进来,下面是这个矩形进度条的完整源代码,基本思想是使用Circle和strokeDasharray为了显示循环进度,它接收currentExp和nextExp作为Angular色经验的值,以计算他们到达下一个l