Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/guibranco/progressbar
Generates a dynamic progress bar image (SVG)
https://github.com/guibranco/progressbar
dynamic dynamic-progress-bar flask hacktoberfest progress progress-bar progressbar python svg
Last synced: 6 days ago
JSON representation
Generates a dynamic progress bar image (SVG)
- Host: GitHub
- URL: https://github.com/guibranco/progressbar
- Owner: guibranco
- License: mit
- Created: 2024-08-09T23:01:11.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2024-10-22T00:25:34.000Z (16 days ago)
- Last Synced: 2024-10-22T19:40:29.560Z (15 days ago)
- Topics: dynamic, dynamic-progress-bar, flask, hacktoberfest, progress, progress-bar, progressbar, python, svg
- Language: Python
- Homepage: https://guibranco.github.io/progressbar/
- Size: 58.6 KB
- Stars: 29
- Watchers: 1
- Forks: 2
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Dynamic Progress Bar
Generates a dynamic progress bar image (SVG) using Python, which is deployed freely via Vercel.
  
Inspired by [](https://github.com/fredericojordan/progress-bar).
---
## Usage
This service is deployed on [Vercel](https://vercel.com) and accessible via the domain [progress-bar.xyz](https://progress-bar.xyz).
---
## Parameters
| Parameter | Description | Default Value |
|--------------------------|----------------------------------------------------------------------------------------|-----------------------|
| `title` | Adds a title to the progress bar | None |
| `scale` | The maximum value that the progress bar represents | 100 |
| `prefix` | A string to add before the progress number | None |
| `suffix` | A string to add after the progress number | % |
| `width` | The width of the progress bar in pixels | 100 |
| `color` | The color of the progress bar (hex code without `#`) | `00ff00` (green) |
| `progress_background` | The background color of the progress bar (hex code without `#`) | `ffffff` (white) |
| `progress_number_color` | The color of the progress number (hex code without `#`) | `000000` (black) |
| `progress_color` | The color of the progress bar (hex code without `#`) | Depends on percentage |
| `show_text` | If should display or hide the progress text | `true` |
| `style` | The style. One of: `default`, `flat`, `square`, `plastic`, `for-the-badge` | `default` |
---
## Examples
Below are several examples showcasing different ways to generate progress bars.
| Example Preview | URL |
|---------------------------------------------------------------------------------|-----------------------------------------------------------------------------------|
|  | [https://progress-bar.xyz/28/](https://progress-bar.xyz/28/) |
|  | [https://progress-bar.xyz/28/?title=progress](https://progress-bar.xyz/28/?title=progress) |
|  | [https://progress-bar.xyz/58/](https://progress-bar.xyz/58/) |
|  | [https://progress-bar.xyz/58/?title=completed](https://progress-bar.xyz/58/?title=completed) |
|  | [https://progress-bar.xyz/91/](https://progress-bar.xyz/91/) |
|  | [https://progress-bar.xyz/91/?title=done](https://progress-bar.xyz/91/?title=done) |
| | [https://progress-bar.xyz/180/?scale=10&title=mark&prefix=R$&suffix=](https://progress-bar.xyz/180/?scale=10&title=mark&prefix=R$&suffix=) |
|  | [https://progress-bar.xyz/420/?scale=500&title=funds&width=200&color=babaca&prefix=R$&suffix=](https://progress-bar.xyz/420/?scale=500&title=funds&width=200&color=babaca&prefix=R$&suffix=) |
|  | [https://progress-bar.xyz/7/?scale=10&title=mark&suffix=X](https://progress-bar.xyz/7/?scale=10&title=mark&suffix=X) |
|  | [https://progress-bar.xyz/420/?scale=500&title=funds&width=200&color=babaca&suffix=$](https://progress-bar.xyz/420/?scale=500&title=funds&width=200&color=babaca&suffix=$) |
|  | [https://progress-bar.xyz/58/?title=colorful&progress_background=ffc0cb&progress_number_color=000](https://progress-bar.xyz/58/?title=colorful&progress_background=ffc0cb&progress_number_color=000) |
|  | [https://progress-bar.xyz/58/?progress_color=ff3300](https://progress-bar.xyz/58/?progress_color=ff3300) |
|  | [https://progress-bar.xyz/58/?width=100&title=Fixed+color&progress_color=ff3300](https://progress-bar.xyz/58/?width=100&title=Fixed+color&progress_color=ff3300) |
|  | [https://progress-bar.xyz/28/?show_text=false](https://progress-bar.xyz/28/?show_text=false) |
|  | [https://progress-bar.xyz/90/?show_text=false](https://progress-bar.xyz/90/?show_text=false) |
---
## Styles
We currently have `flat` (default), `square` and `plastic` styles:
| Example Preview | URL |
|---------------------------------------------------------------------------------|------------------------------------------------------------------------------------------|
|  | [https://progress-bar.xyz/100/?style=flat](https://progress-bar.xyz/100/?style=flat) |
|  | [https://progress-bar.xyz/100/?style=square](https://progress-bar.xyz/100/?style=square) |
|  | [https://progress-bar.xyz/100/?style=plastic](https://progress-bar.xyz/100/?style=plastic) |
---
## Deployment
You can deploy this project to Vercel with a single click:
[](https://vercel.com/import/project?template=https://github.com/guibranco/progressbar)
---
## License
This project is open-source and available under the MIT License.