草庐IT

d3dtexture

全部标签

javascript - 在 D3 转换中获取预期的属性值

例如我有一个转换:varsel=container.selectAll('div').transition().duration(1000).attr('transform','translate(100,500)');在某些时候,我需要知道某些元素落在何处,例如setTimeout(()=>{varvalue=d3.select('div#target').expectedAttr('transform');assertEqual(value,'translate(100,500)');},500);D3中有这样的内置功能吗?否则我将不得不在d3.transition().attr(

javascript - D3 根据节点的文本值进行选择

假设我有一个svg:123我可以使用svg.selectAll()或svg.filter()的什么参数来仅选择值为“2”的文本节点并使用.attr()改变颜色?我找到了很多关于按属性而不是按文本值选择的文献。 最佳答案 text()没有参数是一个getter。因此,在filter中函数,这段代码:d3.select(this).text()==2将被评估为true对于任何值为“2”的元素。这是一个演示:d3.selectAll("text").filter(function(){returnd3.select(this).text(

javascript - 基于边界动态设置初始 d3 缩放 - V4

我有大量节点要显示在页面上,大多数情况下,由于节点放置,圆圈会超出屏幕的可见区域。有没有办法根据节点的整个边界框动态设置初始缩放级别,以便所有节点都适合屏幕的可见区域?更新:我为此添加了一个fiddlehttps://jsfiddle.net/navinleon/6ygaxoyq/3/varsvg=d3.select("svg"),width=+svg.attr("width"),height=+svg.attr("height");varzoom=d3.zoom().scaleExtent([-8/2,4]).on("zoom",zoomed);svg.call(zoom);varg

javascript - 如何使用 d3.js 创建 <dl>

我想使用d3.js从一些数据中创建一系列dl标签。我想出的代码是这样的:varx=d3.select("body").append('ol').selectAll('li').data(data).enter().append('li').append('dl').selectAll().data(d=>Object.entries(d.volumeInfo)).enter();x.append('dt').text(d=>d[0]);x.append('dd').text(d=>d[1]);其中data是一个对象数组。一切正常,只是元素的顺序不正确。这是我设法得到的订单:key1ke

javascript - 将 d3.js SVG 代码转换为独立程序——有什么建议吗?

我有一些用d3.js编写的生成SVG图表的脚本。我想用独立程序生成这些图表——我可以将这些脚本转换为在批处理模式下运行而无需浏览器的最简单方法是什么? 最佳答案 你可以:将其转换为node.js程序。您将有权访问文件系统,并且能够轻松保存生成的SVG。你需要node-canvas替换HTMLCanvas。参见thisd3example开始将d3与节点一起使用。您可以将Chrome中的文件系统API与现有脚本一起使用,以将文件写入硬盘。这可能更容易,因为您只需要在已有的基础上实现文件系统代码。参见thishtml5rocksartic

javascript - 为什么我的 d3 力导向图不显示边?

我使用d3创建了一个简单的力导向图:http://goo.gl/afHTD为什么图形的边缘不显示?这是我的整个HTML文件。当然,您也可以通过在我的链接页面上查看源代码来查看和修改它。它基于d3网站的示例。Force-DirectedLayoutdiv.node{border-radius:6px;width:12px;height:12px;margin:-6px00-6px;position:absolute;}div.link{position:absolute;border-bottom:solid#9991px;height:0;-webkit-transform-origi

javascript - 点击浏览器 "back"按钮显示 JSON 而不是 HTML(使用 Rails 和 d3.js)

我正在使用d3.jsJSON回调在Rails中生成图表,如下所示:查看d3.json(document.URL,function(data){//generatechart}Controllerdefindexrespond_todo|format|format.htmldo#returntheHTMLendformat.jsondo#returntheJSONendendend一切正常。然而,当用户离开此图表,然后使用浏览器上的“后退”按钮导航回到它时,他们会看到JSON而不是HTML。你能建议我如何解决这个问题吗? 最佳答案 嗯

javascript - 如何编写递归 d3.js 代码来处理嵌套数据结构?

我有functionalprogramming的背景并在原则上理解递归,但我似乎无法将这些知识转化为D3.js环境。我下面有一个helloworld脚本,它试图简单地打印嵌套数据结构的内容。根据其他线程的建议,我可以使用.filter仅返回节点,但如何继续此示例以递归打印嵌套项?functiondraw(data){"usestrict";d3.select("body").selectAll("p").data(data).enter().append("p").text(function(d){if(dinstanceofArray){return"WHATDOIPUTHERE?"

javascript - 在 jsf 中使用 d3 图表有技巧吗?

我在Liferay中使用PrimeFaces,让D3示例显示在jsfland中的技巧是什么,特别是Liferay上的PrimeFaces。我试图在JSF中工作的例子是这个:Howwouldd3.jsdifferencechartexampleworkwithjsondata? 最佳答案 我想通了。诀窍是引用div元素而不是body。我见过的所有示例都使用“body”。在门户容器中,您不想使用body,因为这会将您置于portlet之外。div是必需的,并且必须像在javascript中一样被引用。我在下面包含了新代码"method=

javascript - d3中json数据折线图

我正在学习d3。我想使用json数据制作折线图。我使用的数据是:vardata=[{"at":"2014-11-18T07:29:03.859Z","value":0.553292},{"at":"2014-11-18T07:28:53.859Z","value":0.563292},{"at":"2014-11-18T07:28:43.859Z","value":0.573292},{"at":"2014-11-18T07:28:33.859Z","value":0.583292},{"at":"2014-11-18T07:28:13.859Z","value":0.553292},