sigma.js README

The project's README from github.com/jacomyal/sigma.js. As one markdown file: README.md.

Build Status


Sigma.js

Website | Documentation | Storybook | Mastodon

[!NOTE] Sigma v4 is now available as an alpha release. See v4.sigmajs.org for the website, or the v4 branch for the source code.

Sigma.js is an open-source JavaScript library aimed at visualizing graphs of thousands of nodes and edges using WebGL, mainly developed by @jacomyal and @Yomguithereal, and built on top of graphology.

How to use in your project

To integrate sigma into your project, follow these simple steps:

  1. Installation: Add sigma and graphology to your project by running the following command:

    npm install sigma graphology

  2. Usage: Import sigma into your JavaScript or TypeScript file:

    import Graph from "graphology";
import Sigma from "sigma";

    Then, create a new Sigma instance with your graph data and target container:

    const graph = new Graph();
graph.addNode("1", { label: "Node 1", x: 0, y: 0, size: 10, color: "blue" });
graph.addNode("2", { label: "Node 2", x: 1, y: 1, size: 20, color: "red" });
graph.addEdge("1", "2", { size: 5, color: "purple" });

const sigmaInstance = new Sigma(graph, document.getElementById("container"));

How to develop locally

To run the Storybook locally:

git clone [email protected]:jacomyal/sigma.js.git
cd sigma.js
npm install
npm run start

This will open the Storybook in your web browser, which live reloads when you modify the stories or the package sources.

Resources

How to contribute

You can contribute by submitting issues tickets and proposing pull requests. Make sure that tests and linting pass before submitting any pull request.

You can also browse the related documentation here.

How to start a new package

Run npm run createPackage from the project root. It will:

sigma.js (jacomyal/sigma.js)

Searching Database…

12.2K ·GitHub
Sigma.js
这是什么？Sigma.js 是一个开源的 JavaScript 库，借助 WebGL 渲染技术，可用于可视化包含数千个节点和边的图。
这是独立应用，还是我可以添加到自己项目中的库？它是一个安装到 JavaScript 或 TypeScript 项目中的库，构建在 graphology 图数据结构库之上。
我该如何把它添加到我的项目中？将 sigma 和 graphology 安装为依赖，然后导入 sigma，并使用你的图数据和目标 DOM 容器创建一个新的 Sigma 实例。
我需要 graphology 吗？还是可以使用任何图格式？需要。sigma 依赖 graphology 作为底层图数据结构；你需要用 graphology 构建图，然后将其传递给 Sigma。
我应该使用稳定版，还是需要关注更新的版本？当前版本是稳定版，但 v4 alpha 版本已经推出，并拥有自己的网站和分支。如果你转向该版本，API 可能会有所变动。
它能在任何浏览器中运行吗？需要特殊硬件吗？它可以在标准的 Web 浏览器中运行，处理大型图时依靠 WebGL 来保证渲染性能。
在构建自己的图之前，我可以先预览示例吗？可以，Storybook 中提供了可交互的示例，功能完整的 React 演示应用托管在 sigmajs.org/demo。
我可以基于模板创建自己的 sigma 包吗？在项目根目录运行 `npm run createPackage`，会复制 packages/template 文件夹，并生成一个包含更新后配置和元数据的新包。
sigma.js 是否在积极维护？是的，它是一个 monorepo，持续运行 CI（构建、测试、网站工作流），并且正在积极开发 v4 版本。
What are similar projects?cytoscape.js, G6, uPlot, cesium, apexcharts.js, plotly.js, charts, pele
Which topics is it in?graphs, network-analysis, web-application, knowledge, social-network, analysis, graph, interactive, webgl, template, rendering, visualization
Creator
jacomyal
Size
62 MB
Stars
12.2K
Updated
CommitOct 16Release[email protected]Oct 15
Age
14y
Commits · 90 Days