d3.js相关内容

将数组的 JSON 数组转换为 <ul>和<li>元素

我正在 Microsoft Power BI 中创建自定义视觉对象.创建 api 使用 typescript 和 d3 库.我也在用jquery 我正在尝试创建一个层次结构树,它代表被拖入视觉对象的字段.所以树的深度是在运行时决定的,所以它不知道它会有多少层. 我已经设法将我的虚拟数据排列到一个嵌套的 JSON 数组中. 这是我在执行 console.log(finalViewM ..
发布时间:2022-01-10 16:47:41 其他开发

“类型 {} 上不存在属性"使用带有 D3 SVG 符号的匿名函数时出错

我正在尝试创建 D3 SVG 符号,符号形状根据数据中的类别属性动态设置.这将是 PowerBI 中自定义视觉对象的一部分,因此我使用的是 Typings 库. 从我在网上看到的例子来看,下面的代码应该可以工作. var landmarkSymbols = this.milestoneContainer.selectAll('.path').data(viewModel.milestone ..
发布时间:2022-01-10 16:41:50 前端开发

在 D3.js 中使用嵌套数据

我正在尝试使用 D3 显示漂亮的折线图.我的问题是数据的格式. 我有以下数据(例如): var 数据 = [{标签:“姓名",数据:[[14444123, 0.012321312],[14444123, 0.012321312],[14444123, 0.012321312], ...]},{标签:“另一个名字",数据:[[14444123, 0.012321312],[14444123, ..
发布时间:2022-01-07 13:56:07 前端开发

csv 数据到 d3 中的嵌套 json 树

我有一个像这样的 csv 数据文件 根,y,i,5根,c,b,a,7根,c,b,z,2 我想生成类似于 flare.json 的内容数据文件如下: {"name": "root",“孩子们": [{"name": "y",“孩子们": [{"name": "我",“价值":5}]},{名称:"c",“孩子们": [{"name": "b",“孩子们": [{"name": "a",“价值 ..
发布时间:2022-01-05 18:58:27 前端开发

如何使用非树数据创建 d3.js 可折叠力布局?

我有一个 d3 力导向布局,其中数据的结构与下面类似.是否可以应用可折叠力布局,例如 http://bl.ocks.org/mbostock/1062288要吗?我想要一个节点在点击时折叠/展开. {“节点":[{“x":469,“y":410},{“x":493,“y":364},{“x":442,“y":365},{“x":467,“y":314},],“链接":[{“源":0,“目标":1 ..

如何将缩放添加到 d3 可折叠树示例?

我正在尝试向 d3 可折叠树添加缩放功能示例,但无法让它工作.我知道在这里有一个问题即使看起来相当彻底,我的更改也不起作用.我唯一得到的是一个白页.可能与我对 javascript/d3 比较陌生的事实有关.这是我的代码. SVG {指针事件:全部;}.节点{光标:指针;}.node圆{填充:#fff;笔画:钢蓝;笔画宽度:1.5px;}树 { ..
发布时间:2022-01-05 18:52:27 前端开发

带链接的 D3 树图

我是 d3.js 库的新手. 我正在尝试制作一棵树,例如这个,但是有一个链接到每个节点上的外部页面. 有可能吗? 我试图向每个节点添加一个“svg:a",但结果是所有的树都消失了. 更新: 我从上面链接的页面的 html 中获取此代码. 链接的库是: d3.js d3.layout.js 这是所有代码: .node圆{光标:指针;填充:#fff; ..
发布时间:2022-01-05 18:49:59 前端开发

D3树垂直分离

我正在使用 D3 树布局,例如:http://mbostock.github.com/d3/talk/20111018/tree.html 我已根据需要对其进行了修改,但遇到了问题.这个例子也有同样的问题,如果你打开了太多的节点,那么它们就会变得紧凑,使得阅读和交互变得困难.我想在重新调整舞台大小以允许这种间距的同时定义节点之间的最小垂直空间. 我尝试修改分离算法以使其工作: .se ..
发布时间:2022-01-05 18:43:28 前端开发

如何将 D3 树布局的方向更改 90 度

我刚刚开始参与网络可视化,所以我完全是新手.我的目标是显示一个家谱,其中根节点将有多个父节点和子节点.在寻找解决方案时,我发现了这个例子:http://bl.ocks.org/jdarling/2503502这很棒,因为它似乎具有我需要的功能.但是,我想改变方向(从上到下).我尝试使用以下示例:http://bl.ocks.org/mbostock/3184089 但失败了. 我的代码: ..
发布时间:2022-01-05 18:42:36 前端开发

D3 树:线而不是对角线投影

我正在使用 d3.js 通过这个例子创建一棵树. 这可以完美地处理我拥有的数据并产生所需的结果,除了一个细节:我不想要节点之间的那些摆动连接线,我想要一条干净简单的线.谁能告诉我如何制作它? 我一直在查看 d3.js 的 API 文档,但没有成功.据我所知,svg.line 函数应该产生一条直线,给定一组两对坐标 (x,y).我想我需要知道的是:给定这些数据,给定 links 数组中每 ..
发布时间:2022-01-05 18:41:41 其他开发

将节点添加到 D3 树 v4

我正在使用 D3 v4 来构建一棵树. 小提琴:https://jsfiddle.net/a6p​​Lqpxw/ 我现在正在尝试添加对从选定节点动态添加(和删除)子节点的支持. 但是,我无法在不执行完整重绘的情况下重绘图表.我已经修改了可折叠树图代码中的代码:https://bl.ocks.org/d3noob/43a860bc0024792f8803bba8ca0d5ecd ..
发布时间:2022-01-05 18:41:28 前端开发

D3:树状图中的超链接

我无法在 Reingold-Tifold 树图中超链接子元素.该图是在 D3 中构建的,基于 Mike Bostock 使用的示例:http://bl.ocks.org/mbostock/4339184 我的代码和我的 JSON 文件的一部分如下. 此时,图表工作正常 - 如果我单击父节点,它会展开以显示包含在我的 JSON 文件中的一系列子节点.但是当我到达孩子级别时,我想让这个词超 ..
发布时间:2022-01-02 08:39:53 前端开发

使用 React 钩子防止 React 重新渲染 D3 图表

我一直单独使用 React 和 D3,现在有一个项目,我需要对应用程序的绘图功能进行低级别控制.基本上,我需要能够在用户放大时从数据库中获取更高分辨率的数据,反之亦然,当用户缩小时,在绘图上. 我找到了几种将 D3 和 React 结合使用的方法.我想尝试保留基于 hooks API 的所有 React 代码,因为它用于其余代码库.我正在努力为我面临的特定情况获得等效的钩子.React ho ..
发布时间:2021-12-31 16:23:48 其他开发

SVG 无法正确呈现为主干视图

我正在使用 d3.js 在 svg 中渲染世界地图(使用 https://github.com/johan/world.geo.json/blob/master/countries.geo.json 的功能).我将渲染逻辑封装在一个主干视图中.当我渲染视图并将其附加到 DOM 时,我的浏览器中没有显示任何内容,尽管在查看生成的 HTML 时正确生成了 SVG 标记.当不封装在 Backbone.V ..
发布时间:2021-12-29 09:25:06 前端开发

D3.js 是 Neo4j Graph DB 数据实时可视化的正确选择吗

我是 UW 的一名 CS 研究学生,我的团队正在尝试实时可视化放入 neo4j 图形数据库的特定网络流量. 我已经阅读了许多不同的工具,例如 gephi、cytoscape、rickshaw(基于 D3.js)、其他一些工具和 D3.js. 到目前为止,我们一直在使用 D3.js,但希望获得社区的意见.因为neo4j我们不能用cytoscape,感觉D3.js在快速实时环境下处理半大数 ..

Neo4j 可视化 - 操作图形

我目前正在使用 Neo4j Python rest 客户端,我想可视化图表并能够修改它,添加新的节点关系等.此外,我还希望 Neo4j 数据库中的更改.那可能吗?也可以可视化自循环吗?我在 http://www.neo4j.org/develop/visualize 中阅读了有关 D3.js、Neoclipse 和 Gephi 的内容 但我不确定该使用哪个. 提前致谢. 解决方案 您 ..
发布时间:2021-12-28 17:12:17 其他开发

d3.js 的 HTML5 画布替代品,图形可视化库

有没有类似于 d3.js 的 Canvas 库(是 svg 库).我有一个网站 here,我用 svg 元素编写了一个图表,但是它在智能手机的浏览器上效率不高,而且运行速度很慢.我现在想用它的 2d 画布类型来改变它,看看它是否更好.你能推荐一个对此有用的画布库吗? 谢谢... 解决方案 D3 不一定是仅 svg 的库 - svg 在许多情况下使用,但该库可以执行您想要进行的任何类型 ..
发布时间:2021-12-28 14:36:53 前端开发