A cutechart integration for DashPlotly
Project description
💡 Idea
chart.xkcd-react 📊 is an interesting visualization library written in React based on chart.xkcd, the chart style of chart.xkcd-react is so beautiful that I love it at first sight. 😍😍
There is no doubt that Modern JavaScript has more advantages in interaction as well as visual effects. Besides that, as we all know, Python 🐍 is an expressive language and is loved by data science community. To build data sciecne products the community love to use dash. I tried to combine both dashplotly with chart.xkcd-react ended up building the dash_cute_charts component for dash.
Get started with demo example:
git clone https://github.com/muntakim1/dash_cute_charts.git
- Install Dash and its dependencies: https://dash.plotly.com/installation
- Run
python usage.py
- Visit http://localhost:8050 in your web browser, Click here for the Live Demo
Usage 👨🏫
What's new 🍭:
1. Added new charts (stacked,scatter and radarcharts)
2. Fixed some bugs.
Install
Install the dash-cute-charts from pypip using below command
pip install dash-cute-charts
Usage with Dash
import dash
import dash_html_components as html
from dash.dependencies import Input, Output
import dash_cute_charts
app = dash.Dash(__name__)
app.layout = html.Div(
[
# Pie Chart
dash_cute_charts.PieChart(
id="pieChart",
title="What Tim made of",
dataset=[
{
"data": [500, 200, 80, 90, 100],
}
],
labels=["a", "b", "e", "f", "g"],
options=[
{
"innerRadius": 0.5,
}
],
),
# Line Chart
dash_cute_charts.LineChart(
id="lineChart",
title="Monthly income of an indie developer",
xLabel="Month",
yLabel="$ Dollors",
labels=["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"],
dataset=[
{
"label": "Plan",
"data": [30, 70, 200, 300, 500, 800, 1500, 2900, 5000, 8000],
},
{
"label": "Reality",
"data": [0, 1, 30, 70, 80, 100, 50, 80, 40, 150],
},
],
),
# BarChart
dash_cute_charts.BarChart(
id="barchart",
title="github stars VS patron number",
dataset=[
{
"data": [100, 2],
}
],
labels=["github stars", "patrons"],
options=[{"yTickCount": 2}],
),
]
)
if __name__ == "__main__":
app.run_server(debug=True)
Components 🧱
See COMPONENTS.md
Contributing
See CONTRIBUTING.md
Install dependencies
If you have selected install_dependencies during the prompt, you can skip this part.
-
Install npm packages
$ npm install
-
Create a virtual env and activate.
$ virtualenv venv $ . venv/bin/activate
Note: venv\Scripts\activate for windows
-
Install python packages required to build components.
$ pip install -r requirements.txt
-
Install the python packages for testing (optional)
$ pip install -r tests/requirements.txt
- Run code in a Python environment:
- Build your code
$ npm run build
- Run and modify the
usage.py
sample dash app:$ python usage.py
- Build your code
Maintainer 🤵
Muntakimur Rahaman
IBM Certified Data Scientist
website: www.muntakim.xyz
Credits 🙏
📃 License
MIT ©muntakim
Project details
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
Built Distribution
File details
Details for the file dash_cute_charts-0.0.4.tar.gz
.
File metadata
- Download URL: dash_cute_charts-0.0.4.tar.gz
- Upload date:
- Size: 84.1 kB
- Tags: Source
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/4.0.0 CPython/3.8.13
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | 74cfb62323c03568dba21b51d3ffb370b1b8636f38f907e84c37a3003ea6db4f |
|
MD5 | 90b0974f9c3aea2a24e2d6d227df186e |
|
BLAKE2b-256 | bcdb9c7e0d72f32996e066ec35bc0a8c48bb6f2363110289c3577f2f5cc6392a |
File details
Details for the file dash_cute_charts-0.0.4-py3-none-any.whl
.
File metadata
- Download URL: dash_cute_charts-0.0.4-py3-none-any.whl
- Upload date:
- Size: 87.8 kB
- Tags: Python 3
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/4.0.0 CPython/3.8.13
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | f8ed5b441ad3ce0c684b0c19ee8292220b78b9e747224efd903dbdaf90048309 |
|
MD5 | 2d2a41af7d6582fb23999346b0fdc0ff |
|
BLAKE2b-256 | 9be98fff1104a3b4788f19342e9d7d86f5ec5d88e58834e9155d015a722d95eb |