https://github.com/cauliyang/aurora
TSGrah Visualization
https://github.com/cauliyang/aurora
graph js visulization webapp
Last synced: 5 months ago
JSON representation
TSGrah Visualization
- Host: GitHub
- URL: https://github.com/cauliyang/aurora
- Owner: cauliyang
- License: gpl-3.0
- Created: 2023-08-24T04:14:11.000Z (almost 3 years ago)
- Default Branch: main
- Last Pushed: 2025-10-06T01:46:14.000Z (9 months ago)
- Last Synced: 2026-01-17T04:48:12.553Z (5 months ago)
- Topics: graph, js, visulization, webapp
- Language: JavaScript
- Homepage: http://yangyangli.top/aurora/
- Size: 38.1 MB
- Stars: 3
- Watchers: 1
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Aurora Graph Visualization
Aurora is a web application for visualizing graphs using Cytoscape.js.
This application allows you to upload JSON data representing graphs and visualize them with various layout options.
## Documentation
Full documentation is available [here](https://github.com/cauliyang/aurora/blob/main/examples/tutorial_of_aurora.pdf).
## Features
- Upload and visualize graph data in JSON format
- Choose from popular graph layout options
- Capture and export graph visualizations
- User-friendly interface with an interactive graph view
## Getting Started
To run the Aurora Graph Visualization locally on your machine, follow these steps:
1. Clone the repository:
```bash
git clone https://github.com/your-username/Aurora.git
```
2. Navigate to the project directory:
```bash
cd Aurora
```
3. Install the required dependencies:
```bash
npm install
```
4. Build the project:
```bash
npm run build
```
5. Start the development server:
```bash
npm start
```
6. Open your web browser and access the application at
## Usage
- **Upload Graph Data**: Click on the "Upload and Visualize" button to upload a JSON file containing graph data. The graph will be visualized using the default layout.
- **Change Layout**: Use the dropdown list to choose from different layout options for the graph visualization. Select a layout and observe the graph rearrange accordingly.
- **Maximize Graph**: Click this button to maximize the graph visualization for a better view.
- **Capture Graph**: Capture the current graph visualization as an image.
## Development References
- [Refine](https://github.com/refinedev/refine)
- [React Most Wanted](https://github.com/TarikHuber/react-most-wanted)
- [Material UI](https://github.com/mui/material-ui)
## Contributing
Contributions are welcome! If you find a bug or have an enhancement in mind, please create an issue or submit a pull request. Make sure to follow the code of conduct.
## License
This project is licensed under the GPLv3 License.
## Acknowledgments
Aurora is named after the Roman goddess of dawn. The project uses Cytoscape.js for graph visualization and is inspired by the beauty of the dawn sky.
Happy graph visualization with Aurora!