Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/galactic-plane/webgl-globe
A study of the behavior of bezier curves connecting points on a sphere. Particle effects cycles around the curve. A spike is created and marks the point of impact. Performance is measured in the table below if your browser support that.
https://github.com/galactic-plane/webgl-globe
curve heroku html5 threejs webgl webgl-globe
Last synced: about 1 month ago
JSON representation
A study of the behavior of bezier curves connecting points on a sphere. Particle effects cycles around the curve. A spike is created and marks the point of impact. Performance is measured in the table below if your browser support that.
- Host: GitHub
- URL: https://github.com/galactic-plane/webgl-globe
- Owner: galactic-plane
- Created: 2020-07-11T15:00:40.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2024-11-14T15:25:58.000Z (about 2 months ago)
- Last Synced: 2024-11-14T15:44:05.515Z (about 2 months ago)
- Topics: curve, heroku, html5, threejs, webgl, webgl-globe
- Language: JavaScript
- Homepage: https://galactic-plane.github.io/webgl-globe/wwwroot/index.html
- Size: 32.7 MB
- Stars: 3
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# WebGL Globe
![WebGL Globe](https://raw.githubusercontent.com/galactic-plane/webgl-globe/master/infographic.png)
---
## GitHub Version
> Runs static HTML assets only[Live Demo](https://galactic-plane.github.io/webgl-globe/wwwroot/index.html)
## Learn More
WebGL Globe is a cloud-enabled (via the cloud bump map :P), mobile-ready (if you want), earth-powered HTML5/THREE.JS app.### Built With
- jQuery
- three.js
- HTML5
- Materialize-CSS---
## Getting Started
### Prerequisites
Ensure you have the following installed:
- [Node.js](https://nodejs.org/en/download/)
- [Git](https://git-scm.com/downloads)### Clone the Repository
Use git to clone the repository:
```bash
git clone https://github.com/galactic-plane/webgl-globe.git
```## Install
In the webgl-globe directory run:
```bash
$ npm install
```
---
## Run Local
[Node.js](https://nodejs.org/en/download/) :zap: [Express](https://expressjs.com/en/starter/installing.html) :zap: [Nodemon](https://www.npmjs.com/package/nodemon)
```bash
$ nodemon app.js
```## Run Local from Docker
> Using the vivaldi browser (replace with your browser of choice)
```bash
$ docker pull dayafter/webgl-globe:latest$ docker run -dp 3000:3000 dayafter/webgl-globe
$ vivaldi localhost:3000
```
---## Usage
```javascript
let container = document.getElementById('globe');
let globeObj = new DAT.Globe(container);// Random line color
let color = new THREE.Color(0xffffff);
color.setHex(Math.random() * 0xffffff);
globeObj.lineColor(color);// Set particle color
globeObj.particleColor(0x01001f);// Starting point
let originate = [];
originate.push(35.1380556);
originate.push(-79.0075);// Ending points
let marks = [];
marks[0] = [];
marks[0][0] = 39.445723;
marks[0][1] = -123.8052935;
```
---## Contributing
Pull requests are welcome. My journey for learning never ends, so I look forward to your insights. For major changes, please open an issue first to discuss what you would like to change.## License
[MIT](https://choosealicense.com/licenses/mit/)