Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/louis3797/wikipedia-graph
Graphically display the connections between different Wikipedia articles
https://github.com/louis3797/wikipedia-graph
force-directed-graphs react react-three-fiber reactjs three-js threejs typescript wikipedia wikipedia-api wikipedia-scraper
Last synced: about 6 hours ago
JSON representation
Graphically display the connections between different Wikipedia articles
- Host: GitHub
- URL: https://github.com/louis3797/wikipedia-graph
- Owner: Louis3797
- License: mit
- Created: 2022-06-15T13:52:21.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2022-06-16T12:21:27.000Z (over 2 years ago)
- Last Synced: 2023-03-04T11:40:42.992Z (over 1 year ago)
- Topics: force-directed-graphs, react, react-three-fiber, reactjs, three-js, threejs, typescript, wikipedia, wikipedia-api, wikipedia-scraper
- Language: TypeScript
- Homepage:
- Size: 7.46 MB
- Stars: 8
- Watchers: 1
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
3D Wikipedia Graph
Visualize connections between wikipedia pages as froce directed graph
View Demo
·
Documentation
·
Report Bug
·
Request Feature
![screenshot](assets/screenshot2.png)
# Table of Contents
- [Table of Contents](#table-of-contents)
- [About the Project](#about-the-project)
- [Features](#features)
- [Tech Stack](#tech-stack)
- [Getting Started](#getting-started)
- [Prerequisites](#prerequisites)
- [Installation](#installation)
- [Run Locally](#run-locally)
- [License](#license)
- [Contact](#contact)
## About the Project
With this tool you can visualize the connections between Wikipedia pages. You can also specify how deep the search should go and how many connections should be taken per page. The result are incredibly nice looking graphs, as seen in the images above. Note that the program starts to slow down when the graph reaches a certain size, since the whole thing runs in the browser.
### Features
- Force Directed Graph
- 3D
- Zoom on Node when clicked
- Postprocessing
- Adjustable Depth
- Adjustable Connections per Vertex### Tech Stack
- [Typescript](https://www.typescriptlang.org/)
- [React.js](https://reactjs.org/)
- [Three.js](https://threejs.org/)
- [React Three Fiber](https://docs.pmnd.rs/react-three-fiber/getting-started/introduction)
- [React Force Graph](https://github.com/vasturiano/react-force-graph)
- [Leva](https://github.com/pmndrs/leva)## Getting Started
### Prerequisites
This project uses Yarn as package manager
```bash
npm install --global yarn
```### Installation
Install wikipedia-graph with yarn
```bash
yarn install wikipedia-graph
cd my-project
```### Run Locally
Clone the project
```bash
git clone https://github.com/Louis3797/wikipedia-graph.git
```Go to the project directory
```bash
cd my-project
```Install dependencies
```bash
yarn install
```Start the server
```bash
yarn start
```## License
Distributed under the MIT License. See LICENSE.txt for more information.
## Contact
Project Link: [https://github.com/Louis3797/wikipedia-graph](https://github.com/Louis3797/wikipedia-graph)