如何动态更改sigma.js设置？
Sigma.js是一个用于可视化网络图的JavaScript库。它提供了一系列的API和配置选项，可以用来动态更改图形的设置。下面是如何动态更改Sigma.js设置的步骤：
- 引入Sigma.js库：在HTML文件中引入Sigma.js库的JavaScript文件。
<script src="sigma.min.js"></script>- 创建一个图形实例：使用Sigma.js的
sigma函数创建一个图形实例，并指定要渲染图形的容器。
var graph = new sigma({
container: 'graph-container'
});- 添加节点和边：使用
graph对象的addNode和addEdge方法添加节点和边。
graph.addNode({
id: 'node1',
label: 'Node 1',
x: 0,
y: 0,
size: 1,
color: '#ff0000'
});
graph.addEdge({
id: 'edge1',
source: 'node1',
target: 'node2',
color: '#000000'
});- 设置图形样式：使用
graph对象的settings属性来设置图形的样式。
graph.settings({
defaultNodeColor: '#ff0000',
defaultEdgeColor: '#000000'
});- 渲染图形：使用
graph对象的refresh方法来渲染图形。
graph.refresh();- 动态更改设置：使用
graph对象的settings方法来动态更改图形的设置。
graph.settings({
defaultNodeColor: '#00ff00',
defaultEdgeColor: '#0000ff'
});
graph.refresh();通过调用settings方法并传入一个包含要更改的设置的对象，可以动态更改图形的设置。在上面的例子中，我们将默认节点颜色更改为绿色，将默认边颜色更改为蓝色，并通过调用refresh方法重新渲染图形。
相关·内容
我在drawLabels:true中使用sigma.js。
当我缩小时，标签开始相互重叠，所以我想在s.camera.ratio足够大时禁用它们。
我的尝试是：
document.getElementsByClassName('sigma-mouse')[0]
.addEventListener("mousewheel", function() {
console.log(event)
if (s.camera.ratio > 20) {
// Set drawLabels to false
浏览 1提问于2016-08-26得票数 1
回答已采纳
1回答
当我从Gephi导出到Sigma.js并使用Google Chrome打开我的图形时，它没有显示(只显示默认的右侧Sigma.js -panel)。
如何在Gephi (如)中制作基于web的网络图？
浏览 12提问于2017-07-17得票数 0
2回答
使用JS实现动态图形可视化
、、、、
我想要可视化一个动态的图形。实际上，我看看一些库是如何处理它的，比如d3.js，sigma.js和cytoscape.js。问题是这些库正在从特定的文件读取图形数据，在我的例子中，这些数据将使用程序(动态)生成。
我想知道我是否可以用包含所有信息的字符串文本替换文件数据？
浏览 1提问于2015-08-25得票数 0
我想知道是否有专门针对react-sigma-v2或仅针对sigma.js的合适文档。有几个例子，但即使是这些例子，在它可以显示的程度/如何使其适应您的项目方面也有限制。除了github和之外，有没有其他任何人可以推荐的资源来更好地理解sigma.js呢？
浏览 6提问于2021-11-11得票数 0
如何在Sigma.js v2.1.3中设置边缘的类型曲线？type: "curve"不工作
浏览 5提问于2021-12-27得票数 0
回答已采纳
1回答
我是新来的。根据titandb文档，有预定义图(GraphOfTheGods)。我想使用sigma.js或任何其他工具来可视化图形。为此，我想将titandb与sigma.js集成在一起。
请帮助我与任何图形可视化软件集成titandb。
提前谢谢。
浏览 9提问于2015-11-08得票数 1
回答已采纳
我正在研究是否可以使用sigma.js (或等效物)从表格数据集(在MYSQL中)生成网络图。从我的研究来看，sigma.js的json格式需要每个节点的x、y和大小值，这表明“图”即。已设置相对x&y位置和大小。
在此之前，我对网络图完全不熟悉，但似乎sigma.js和我的数据之间缺少的一环是这个x，y，大小，数据的生成。一旦我有了这些变量，从php生成json显然是一件微不足道的事情，但我不知道如何才能做到这一点，而且google也没有提供任何库。有一些独立的应用程序，但这并不好，因为它需要安装在web应用程序中。
可能是我不知道要搜索什么才能找到我需要的东西。
有谁知道我如何在p
浏览 2提问于2015-12-03得票数 5
我使用的技术不幸地依赖于旧的框架(看看那个看起来很现代的网站！)。我想在页面上包含一个sigma.js图形，但只需将脚本标记放在导入sigma上就会出现以下错误：
TypeError: sigma.utils.matrices is undefined sigma.min.js:2
我不知道这的确切原因，虽然我，但我认为它与Prototype.js冲突。
有没有可能把我所有的sigma.js代码和sigma.js导入放在一个自动执行的函数中，这样它就不会冲突了？
浏览 6提问于2014-08-27得票数 0
我正在尝试使用Sigma.js创建一个填充整个页面空间的图形。现在默认布局是一个正方形：
我已经通读了文档，我想我必须创建一个。我已经查看了项目的，但是我不确定应该在哪里指定页面的全宽和全高。
任何提示或帮助都将不胜感激！
浏览 0提问于2014-08-20得票数 0
1回答
Sigma.js在他们的GitHub上列出了几个，但他们并不清楚加载一个插件需要什么。
我尝试简单地包含一个指向插件的JavaScript文件的<script>标签，但没有成功。如何将插件导入/使用/复制粘贴到我的站点？
浏览 3提问于2013-04-21得票数 9
回答已采纳
2回答
我想发现sigma.js，这样我就可以在项目中使用它。我已经知道一点d3，但是通过在互联网上的搜索，人们提到sigma更适合于图形，而在我的例子中，例如在图形数据库中，sigma可能更好。但我搜索了一下，找不到很多关于sigma或任何教程的文档。即使是jacomy网站上的例子也不存在。有人能建议我从哪里开始学习sigma.js吗？
浏览 17提问于2016-12-01得票数 0
3回答
Neo4j图形可视化库
、、、、
最近，我探索了一些可以从Neo4j可视化图形的库，但没有得到一个清晰的视图来选择，所以我有几个想要分享的。
我的需求和愿望-在通过REST API进行搜索后，使用cypher查询可视化所有关系、节点的图形。和结果使交互式-能够拖放...点击即可显示其他节点/关系。通过json数据导入节点，能够快速显示至少400个元素。
所以我或多或少探索了更多的库：
Three.js -主要用于3D。(如果我不需要3D，那么最好不要选择这个)
Arbor.js -绘图由你决定，主要是布局库
VivaGraphJS -易于使用，但几乎没有文档:(
D3.js -看起来不错，但使用的是SVG
Cytoscape.
浏览 5提问于2013-09-02得票数 6
1回答
我使用sigma.js来显示一个相当大的图形。当用户双击一个节点时，我想让摄像机放大这个节点--谢天谢地，这是从盒子里出来的。但是，当一个节点被双击时，我也希望重新绘制图形:我希望附近的项目被重新定位，以选定的节点为重心，如果有任何与选定节点直接边缘的节点在缩放后位于可见屏幕之外，我希望这些边缘被缩短，以便这些项目是可见的。
这两项要求中的任何一项是否有技术术语？(总的来说，我对sigma和JS还比较陌生，也不知道这样的术语，但如果我知道如何用语言表达我想做的事情，这将帮助我自己解决这个问题)。
如何在sigma.js中满足这些需求？
是否有另一个更适合我需要的可视化框架？
浏览 1提问于2014-02-27得票数 0
1回答
所有节点上的Sigma.js边框
、、、、
我正在用实现一个可视化(如果有任何关联的话，可以使用 )。Sigma.js在所有悬停的节点上显示矩形标签和模糊边框。为了获得更好的视觉清晰度，我感兴趣的是在所有节点上严格围绕循环节点实现边框(最好不是模糊的)，而不是仅仅在循环节点上徘徊或单击。我理解预先打包的设置只允许对悬停的节点边框进行更改。任何关于修改所有节点边界的指导都是非常感谢的。我预计这将涉及修改原始的Sigma.js源代码，但目前还不清楚在哪里。谢谢大家！
浏览 5提问于2014-12-05得票数 1
回答已采纳
2回答
我是一个全新的编程新手，在使用dragNodes插件时遇到了一些问题。我可以用生成的随机图示例让插件自己工作，但我正在努力让它用我自己的图工作。
我不知道该在html中放什么。我试着只说：
`<script src="sigma.js/plugins/sigma.plugins.dragNodes/sigma.plugins.dragNodes.js"></script>sigma.plugins.dragNodes(s, s.renderers[0]);`
它不会让我的节点移动。我想我必须改变"s“和"s.renderers”的内容，但
浏览 0提问于2015-02-04得票数 1
我需要一个开放源码的解决方案来可视化一个neo4j图形在一个web应用程序。我在看alchemy.js，看起来很酷。我最终想做的是为不同的节点类型使用图标，而不是仅仅使用不同的颜色。有办法在alchemy.js中做到这一点吗？如果是这样的话，是怎么做的？如果没有，是否有不同的开放源码工具包可以启用此功能？显然，KeyLines是这么做的，但它远不是开源的。
谢谢!
浏览 5提问于2015-04-01得票数 5
我试图画一个有向(箭头)图，但是箭头太小了，你几乎看不见它们。
function addArrowToGraph(src, dst) {
s.kill();
g.edges.push({
id: 'e' + g.edges.length,
source: 'n' + src,
target: 'n' + dst,
size: 100,
color: '#ccc',
minArrowSize: 100,
浏览 4提问于2019-06-12得票数 0
我在Sigma上胡乱摆弄，我似乎不能让线变得有曲线。常规箭头可以正常工作，但弯曲箭头则不行。
var graphData = {
"nodes": [
{ "id": "n0", "label": "A node", "x": 0, "y": 0, "size": 3 },
{ "id": "n1", "label": "Another node", "x": 3,
浏览 26提问于2018-02-21得票数 4
我正在使用ArangoDb，在我最终将数据放入数据库之后，我现在想要可视化我的图形。可悲的是，内置的可视化对我来说还不够，因为我需要做一些事情，比如突出显示节点和改变边缘的厚度等。
因此，我正在寻找一种方法来可视化一个能够做这些事情的图形。我找到了似乎是我需要的Sigma.js，但是有没有一种方法(很容易，因为我相当缺乏经验)在ArangoDb图中使用Sigma.js？
浏览 6提问于2015-11-10得票数 2
2回答
我想用sigma.js来显示一些点阵图。但是sigma.js似乎只支持json图形格式。
有没有一些bash工具或javascript模块可以将DOT图转换为json图？
例如，从点图中：
graph {
n1 [Label = "n1"];
n2 [Label = "n2"];
n3 [Label = "n3"];
n1 -- n2;
n1 -- n3;
n2 -- n2;
}
传输到JSON图：
{
"nodes": [
{
"id": "n0",
浏览 3提问于2016-10-26得票数 8
1回答
我有一个树状结构的网络。我想将出现在同一级别的节点放在一个圆的形式中。因此，可以将一个级别可视化为同心圆。
我想使用Sigma.js来做这件事。
假设我知道每个节点的级别。然后，如何选择节点的x和y坐标。
节点和边的数据在json文件中。
浏览 7提问于2020-01-17得票数 0
1回答
我正在尝试使用React Sigma包装来呈现一个复杂的网络。我知道这个网络的基本结构是多个一级节点，有些是非常高层次的节点。为此，我将图形数据预先格式化为表示近似布局的x和y坐标，一级节点聚集在连接到的节点周围。然后，我想从这里运行ForceAtlas2模拟。然而，当我尝试这样做时，模拟似乎只是随机化和改变节点的初始位置以位于中心位置，如下面的gif所示：
有没有办法阻止这种情况发生，并从初始位置运行模拟？我的代码如下：
const App = () => {
const myGraph = getExampleGraph();
return (
浏览 4提问于2020-11-17得票数 1
回答已采纳
我正在尝试生成一个应该与sigma.js兼容的json文件来绘制图形？我能知道它应该是什么格式吗？在C++中。
浏览 4提问于2014-12-28得票数 1
2回答
我目前正在使用sigma.js进行一个项目，在该项目中，我需要显示存储在JSON文件中的大量节点和边缘(每个节点和边的数量为10000到100000)。但是，当我在每次刷新时加载JSON时，以及当它向我显示图形时，这个库就会变得滞后，它不会对节点进行空间划分。我想知道是否有人知道如何表示这种数据集。
浏览 5提问于2016-04-11得票数 10
回答已采纳
我想旋转我用Sigma.js创建的图形，以便有一个更完整的图形视图，我设法用‘相机’来做，但只绕着一个轴，我想知道是否可以绕着几个轴做。谢谢
浏览 1提问于2016-08-01得票数 0
我想知道典型的javascript拓扑图库是否可以很容易地定制，以便在我悬停或单击节点对象时执行一些操作？我目前正在考虑的库是D3.js、chartjs和sigma.js，这些操作可能包括通过JavaFX调用Java方法。如有任何建议，我们将不胜感激。
谢谢!
浏览 4提问于2013-10-15得票数 3
我正在使用sigma.js，并尝试添加背景图像，而不是背景颜色。它可以找到，但不能放大/缩小。有人已经添加了一个问题，但还没有答案。那么谁有解决这个问题的办法呢？
浏览 5提问于2015-12-11得票数 5
2回答
我正在使用SIGMA.JS库创建图形。它正在被绘制，但我无法在图形上绘制边标签。我遵循并尝试使用以下线程中提到的Github库：
但由于它不是很详细，我无法解决我的问题。
我在JSON中使用以下示例数据。
{“edge”：{"source":"19"，"target":"3"，"id":"abc"}，
“节点”：[ {"label":"a1"，"x":-158，"y":-171，"id":"19"，&#
浏览 1提问于2014-09-22得票数 0
我在这里搜索，找到了他们是一个画布渲染器的参考，但没有找到它作为一个选项。那个项目完成了吗？
我正在尝试渲染200-300个节点和大约600-1000个边，但没有看到可接受的性能。我最初一直在使用sigma.js，并对渲染感到满意，但由于缺少文档和小功能集而不得不使用cytoscape.js...which，我喜欢它是如何轻松地使用样式以及访问节点和边缘属性……
浏览 1提问于2013-09-12得票数 1
我在试着用。我真的不是一个使用Javascript的人，但是我甚至连最基本的东西都做不到。
在开发者控制台中，我得到了以下信息-
Use of getPreventDefault() is deprecated. Use defaultPrevented instead.
是这导致了我的问题，还是我的HTML/ Javascript出了什么问题？
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Th
浏览 3提问于2014-01-02得票数 0
6回答
我在找一个可以可视化网络的图书馆。
我只需要添加一些节点(节点上有文本)，在它们之间添加边(边是定向的，上面有文本).I不想手动设置任何位置。
我希望API简单如下：
var node1 = X.addNode(1, "Hello"),
node2 = X.addNode(2, "World");
X.addEdge(node1, node2, "helloworld");
我找了好几个小时，看了arborjs，sigma.js，d3.js，JavaScript InfoVis工具包，没有一个能让我满意。
还有什么我可以试一试的吗？
浏览 3提问于2012-06-05得票数 6
回答已采纳
1回答
我完全是javascript的初学者，但我希望能用它来完成一些关于Sigma.js的任务。
首先，我想知道如何搜索节点。从我在网上收集的资料中。如果我制作了一个表单，下面的javascript将读取它：
function readText (form) {
TestVar =form.inputbox.value;
alert ("You typed: " + TestVar);
//Here I am trying to loop through all the nodes to see if it matches the typed value.
浏览 2提问于2014-03-27得票数 1
4回答
随函附上Javascript控制台(Chrome版本36.0.1985.125米)执行后的屏幕截图：
console.log(node)
console.log(node['read_cam0:x'])
console.log(node['label'])
为什么node["read_cam0:x"]是未定义的？
在sigma.js添加了问题：
更新: Firefox控制台显示如下：
请查看左侧对象中缺少但右侧显示的read_cam0 (单击左侧的对象后)。
浏览 2提问于2014-08-04得票数 2
回答已采纳
1回答
我试图用sigma.js绘制一个图形。我已经完成了，但是问题是图表没有包含在相应的容器中。
见下面的截图：
这是我的html代码：
<div id="graph">
<div id="sigma-container">
</div>
</div>
这是CSS：
#graph {
position: relative;
width: 700px;
min-height: 400px;
margin-top: 2%;
margin-left: auto;
浏览 1提问于2014-11-07得票数 0
回答已采纳
1回答
目标
我正试图在中实现扩展和崩溃。在任意节点的右击下，它将添加新节点并连接其边缘，但它被放置在任意位置。
我希望在空闲空间中添加节点，它们不应该与其他节点发生冲突或重叠。它应该用动画慢慢扩展，在像这样的自由空间区域扩展。。
代码
<!DOCTYPE html>
<html>
<head>
<title> Airlines Graph Render </title>
<script src="../build/sigma.min.js"></script>
<scri
浏览 2提问于2017-10-28得票数 3
回答已采纳
我正在使用sigma.js的javascript库来显示图形，除了Windows上的Internet Explorer8之外，它在所有的浏览器上都运行得很好。有人知道问题出在哪里吗？或者我使用的div层上的z-index，或者类似的东西？
以下是网站：
这是一个库：
谢谢!
PS如果任何人有Internet Explorer9，我将不胜感激，如果你能告诉我，如果图表也显示在那里。
浏览 0提问于2012-06-28得票数 0
1回答
我正在尝试建立一个简单的web应用程序，带有React/类型记录，这样我就可以用Sigma.js来处理一些图表了。但我无法得到最终的结果来渲染任何西格玛。
下面是我遵循的步骤：
$ npx create-react-app sigmafiddle --template typescript^C
$ cd sigmafiddle
$ yarn add sigma
$ yarn add @types/sigmajs
然而，当我去导入Sigma时，我会遇到以下问题：
import { sigma } from 'sigma'
此错误消息失败：
TypeScript错误在~/dev
浏览 5提问于2020-03-15得票数 0
问题
在中生成有向边需要什么？我正在寻找一个最小的例子，最好是基于目前在他们的上的最小例子。
尝试
我尝试通过以下方式修改中的最小图形示例
sigma.parsers.json('data.json', {
container: 'container',
settings: {
defaultNodeColor: '#ec5148',
+ defaultEdgeArrow: 'source' // adding this line should add arrows?
}
})
浏览 1提问于2014-02-18得票数 27
1回答
使用Sigma.js，我想向图形的节点添加自定义图像。我找到了，包含了nodeShapes.js和plotter.js，然后添加了一个图像属性：
var imgUri="somepicture.png"
sigInst.addNode(id,{
'x': Math.random(),
'y': Math.random(),
'label': data.nodes[i].val,
浏览 5提问于2014-01-09得票数 2
//Settings for sigma instance (WebGL on latest Chrome)
var settings={
defaultNodeColor: "#5FBA7D",
nodeHoverColor: "default",
defaultNodeHoverColor: "#F69C55"
}
正常的节点颜色在我的图形中显示得很好，但是当在一个节点上盘旋时，颜色不会改变。有什么建议吗？
浏览 3提问于2016-05-17得票数 0
回答已采纳
我帮助创建了一个web应用程序，它使用sigma.js在neo4j数据库上显示图形输出。
我正在尝试使用带有这个的ne4j-driver，以使我能够在远程服务器上设置这个web应用程序，它自己的版本的neo4j社区版一直在运行。
目前的问题是，每当你通过远程连接到服务器运行web应用程序时，如果你在本地机器上运行，它只会链接到neo4j。
我被告知要下载上面的驱动程序，并使用螺栓协议来修复这个问题，但是我不能让它工作。
我不是一个经验最丰富的程序员，但是我尝试过使用require(‘ne4j-driver’)，但是没有用，我还尝试将它链接到'bolt://localhost:7867‘
浏览 31提问于2018-10-05得票数 0
我正在构建一个java/javascript应用程序，以便从Neo4j中提取数据并将其可视化。
我选择使用spring data / spring data rest，以便通过rest API与图形交互，它工作得很好。
为了实现可视化，我尝试了sigma.js。sigma.js期望的JSON格式与spring data rest公开的格式不同。为了继续前进，我想通过适当的JSON转换实现一个自定义控制器(使用spring MVC)。
我的目标是能够通过UI提供一个入口点(例如，一个节点)，并且能够与图形进行动态交互。
你认为这是正确的设计吗？有什么建议吗？
谢谢
问候
浏览 3提问于2014-11-07得票数 0
2回答
我一直在尝试用Svelte / Sveltekit加载sigma.js，但似乎没有组件集成，也没有关于如何实现这一点的指导。我试着在Sveltekit中作为客户端代码加载它，但没有成功，但我不知道这是否是一种合法的方法。在使用Sveltekit运行的Sigma.js中，有没有简单图的工作示例？
浏览 8提问于2022-07-09得票数 4
我正在使用引导作为我的网站项目的主要前端框架和作为图形可视化库。
...
<div id="graph-container" style="width: 540px; height: 300px;">
</div>
<script>
...
$(document).ready(function() {
s = new sigma({ graph: graph, container: 'graph-container' })
});
</script>
我
浏览 1提问于2015-04-13得票数 0
回答已采纳
我正在尝试测试sigma.js (v2)的极限，以确定它是否适合我们的项目。从我在各种示例应用程序中看到的情况来看，它看起来非常有希望。不幸的是，我找不到适当的文件。
我所能找到的只是演示应用程序和一些(看起来相当过时的) Wiki子页面(即)。
基本上，我需要知道SigmaJS的特性集，我不想深入了解整个源代码;)
我现在要找的是：
当我这样做的时候，我能通过什么全局设置.？
const sigmaRenderer = new Sigma(graph, container, settings);
在Sigma中实现了哪些节点和边缘属性？
例如，我可以像这样设置坐标、大小、类型
浏览 11提问于2022-03-07得票数 5
4回答
我在角指令中使用Sigma.js有困难。
我正在采取的步骤是：
我已经用约曼构建了我的应用程序。
我已将西格玛安装为bower_component，并运行npm run build以获得小型化的sigma.min.js。
我已经将它作为脚本添加到我的index.html中
我在我的sigma中添加了app.js作为一个依赖项。
我已经将它作为依赖项导入到我的指令中，作为sigma
我得到的错误是：module 'sigma' is not available
有人知道这是怎么回事吗？
这是代码: app.js
angular.module('
浏览 5提问于2014-07-30得票数 3
回答已采纳
1回答
我正在使用sigma.js和角js一起构建我的可视化web应用程序。
问题陈述:我编写的代码是这样的:当筛选条件发生变化时，筛选模块将被触发以基于用户选择(参见下面的代码).But过滤节点，最初过滤器工作良好，没有任何问题，但后来似乎不起作用。看起来它根本没有执行过滤器谓词。
我尝试了以下可能的方法，但没能解决这个问题。
1)为每个数据更改触发器销毁并重新创建筛选器对象。
2)未注册和注册过滤器谓词。
代码片段：
scope.$watch('filtersettingdata',function(){
s = new sigma({
graph: sc
浏览 7提问于2014-09-21得票数 0
嗨，我有一个用例，我希望我的应用程序动态地决定xyz_tokizer、xyz_filter、xyz_synonyms等。
类似于“获取测试/搜索”的东西
{
"query":{
"match": {
"content": {
"query": "search_text",
"analyzer": {
"filter": "xyz_filter",
"
浏览 2提问于2020-05-05得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
