问题标签 [vivagraphjs]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
84 浏览

javascript - 检查重复节点 VivaGraph js

我想在创建新节点之前检查节点是否存在。从 VivaGraph GitHub 文档中我找不到任何东西。

0 投票
1 回答
69 浏览

javascript - Vivagraph.js 中节点选择和鼠标移动的 Y 轴方向错误

我使用 vivagraph.js 和 webglGraphics 制作了一个简单的图表,并在节点上添加了图像。但是节点在 Y 轴上移动不正确。当我选择节点并向上移动鼠标时,图像会向下移动。我该如何解决?

0 投票
1 回答
759 浏览

javascript - 网络图可视化节点点击并渲染页面

这个问题是新问题,因为它使用 vivaGraphJS,而不是 D3。有一些关于 D3 的问题,但解决方案略有不同。

我正在尝试使用此 VivaGraph JS 在我的网页上可视化网络图。

下面是我网站的示例网络图。以及它的 HTML 和 JavaScript。我想要做的是当用户单击特定节点时,然后转到特定页面。

示例网络图

从示例图中可以看出,每个节点都有它的图像和“名称”,我想做:当我点击一个名为“name1”的节点时,我想去https://sample.com/sample/name1 .

我尝试使用“a href”,但没有用。我不知道该怎么做。如果有人知道该怎么做,请帮助我。graph.addNode 部分上的 url 是节点图像链接,而不是我单击节点时想要去的链接。此 JavaScript 脚本被放入 html 中,而不是 HTML 上的单独和链接的 javascript 文件。下面的脚本在 .

在 HTML 文件中的一个 div 标签处,我调用了 main 函数。

0 投票
1 回答
105 浏览

javascript - ZeroMQ (ZMQ) 在客户端提供 VivaGraph 图

我正在构建一个 HTML 页面,该页面呈现使用 VivaGraph ( https://github.com/anvaka/VivaGraphJS ) 创建的图表。

该图应由来自 ZMQ (ZeroMQ) 数据流的数据提供,其中我的网页作为“订阅者”连接到“发布者”;完美的示例代码在这里:https ://github.com/zeromq/zeromq.js/#pubsub

问题是:VivaGraph 用于客户端的 JS,而 ZMQ 用于 NodeJS 环境。

如何将我的 VivaGraph 图绑定到客户端的 ZMQ 数据流?

0 投票
1 回答
771 浏览

javascript - 如何绘制箭头以通过 ngraph.pixi 与 PIXI.js 与 webgl 链接?

我画了直接图,所以我画了箭头到直线上,我是 pixi.js 和 javascript 的新手,我想学习它,你能帮我画一个箭头吗?

这是一个演示,我想在链接中添加箭头。

这是在这个类中绘制链接的代码

这是完整的代码

重现代码的链接在这里

非常感谢

0 投票
1 回答
1237 浏览

javascript - 在鼠标上绘制文本 将鼠标悬停在光标位置的图形上

当我在光标位置绘制 PIXI.Text 时遇到问题。

这是重现问题的简单演示,当您用光标越过节点时,我会绘制文本,在这种情况下,“@author vincenzopalazzo”但我想要节点上的位置,所以我认为为了解决问题我已经得到解决方案我必须设置鼠标的位置。

但我不知道得到这个职位,所以这是一个用 PIXI 重现问题的例子

这是我的真实代码

我在 ctx (它是 PIXI 图形)对象上使用 ngraph.events,方法 on and fire 是模块 nghraph.events

0 投票
1 回答
1242 浏览

javascript - 如何使用大量数据(Visjs、cytoscape、sigma 和 vivaGraph)快速绘制社交网络?

我必须创建一个包含大量数据的社交网络。我用visJs,网络很慢。

我尝试了这些插件:Cytoscape、visJs、Vivagraph 和 sigma。

Visjs、cytoscape 和 sigma 的问题

  • 他们很慢

vivaGraph 的问题

  • 我不能用 svgGraph 渲染 webglGraph,所以我不能有很多节点和边,并在边上放一个箭头。

vivaGraph的优势:

他真的很快,因为我可以用 webGl 渲染图形。但我不能或者我不知道如何使用这个插件添加图形。

使用 visjs:

  • 我可以快速初始化图表,因为我可以将位置保留在数据库中,并且可以停用物理。

问题是我无法进行任何更改,因为当动态添加一个点时,必须重新计算所有其他点,而且 visJs 太长了。

我有并且我想要这样的东西(用 visJs 完成): 我希望能够做到这一点:所有的网络 在此处输入图像描述

  1. 修改节点和边缘颜色、大小、名称等。

  2. 使用最少 10 000 个节点快速更新和生成图形。

  3. 布局类似于我展示的布局(如果可能按颜色分组)

所以我有两个问题:

  1. 有没有办法在初始化后用 visjs 快速动态添加?

  2. 知道我至少有 10,000 个节点,如何快速生成图表?

有没有一种技术可以快速生成具有良好布局的图形?

0 投票
0 回答
135 浏览

javascript - Vue 组件和原生代码之间的通信

我构建了一个应用程序来显示连接图,我发现使用 Vue.js 开发一些功能很有用。

出于测试目的,我尝试在 vue 组件中封装一个最简单的图形,强制定向布局,但帧速率显着下降(SVG 中有 600 个节点,每个节点随机连接 3 个链接 => min FPS 2.4 max FPS ~9)。

这在我的范围内是不可接受的。

我的目标是在用户向 vue 组件添加/删除节点时发出信号并向后发送,并且通常将图表上的事件发送到 vue 组件并向后发送。

基本上我想在本机代码中保留图形的呈现,为简单起见,可以使用 vue 组件中的数据结构和方法。但是我觉得我做不到,因为vue找不到对应的UI。

我应该使用哪种方法在原生编码图和 Vue 组件之间进行通信?

我可以直接在内部调用组件,用 smtgvue.$data让我的图表做出反应吗?

你能举一个简单的例子来展示如何访问methods, props,events在 vue 组件内部使用吗?

下面是一个小测试(使用 Vivagraph 库):

在此处输入图像描述

0 投票
0 回答
63 浏览

javascript - 如何在 VUE 3 上使用 VivaGraphJS 在浏览器上显示图表?

我正在尝试在主页视图中使用 VUE 3 在浏览器上显示图表。为此,我使用命令安装了 VivaGraphJS

然后我从网站https://www.npmjs.com/package/vivagraphjs中获取了最小的示例,并尝试了几种方法将其包含在模板中,但没有成功。

当我 console.log() 渲染器时,我可以在控制台中看到对象,所以我知道所有功能都在工作。但是浏览器中没有显示任何内容。

非常感谢

0 投票
1 回答
97 浏览

javascript - xhtml页面中的js脚本已启动但结果不可见

这是一个 JSF 2.3,Primefaces 10 项目。

文件 vivagraph.js 是从这里下载的,它包含在项目中,如下所示:

文件组织截图

xhtml页面:

注意:这是改编自Vivagraph.js wiki 上的基本示例

当页面加载时,它保持空白。我希望看到一个图表,其中 2 个节点“space”和“bar”通过 link 连接。控制台打印“测试打印”,没有显示错误。

如果这有帮助,则生成的 html: