Skip to main content

A cutechart integration for DashPlotly

Project description

💡 Idea

GitHub license GitHub stars GitHub forks

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.

image

Get started with demo example:

  1. git clone https://github.com/muntakim1/dash_cute_charts.git
  2. Install Dash and its dependencies: https://dash.plotly.com/installation
  3. Run python usage.py
  4. 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.

  1. Install npm packages

    $ npm install
    
  2. Create a virtual env and activate.

    $ virtualenv venv
    $ . venv/bin/activate
    

    Note: venv\Scripts\activate for windows

  3. Install python packages required to build components.

    $ pip install -r requirements.txt
    
  4. Install the python packages for testing (optional)

    $ pip install -r tests/requirements.txt
    
  • Run code in a Python environment:
    1. Build your code
      $ npm run build
      
    2. Run and modify the usage.py sample dash app:
      $ python usage.py
      

Maintainer 🤵

Muntakimur Rahaman

IBM Certified Data Scientist

website: www.muntakim.xyz

Credits 🙏

chart.xkcd-react chart.xkcd

📃 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

dash_cute_charts-0.0.4.tar.gz (84.1 kB view details)

Uploaded Source

Built Distribution

dash_cute_charts-0.0.4-py3-none-any.whl (87.8 kB view details)

Uploaded Python 3

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

Hashes for dash_cute_charts-0.0.4.tar.gz
Algorithm Hash digest
SHA256 74cfb62323c03568dba21b51d3ffb370b1b8636f38f907e84c37a3003ea6db4f
MD5 90b0974f9c3aea2a24e2d6d227df186e
BLAKE2b-256 bcdb9c7e0d72f32996e066ec35bc0a8c48bb6f2363110289c3577f2f5cc6392a

See more details on using hashes here.

File details

Details for the file dash_cute_charts-0.0.4-py3-none-any.whl.

File metadata

File hashes

Hashes for dash_cute_charts-0.0.4-py3-none-any.whl
Algorithm Hash digest
SHA256 f8ed5b441ad3ce0c684b0c19ee8292220b78b9e747224efd903dbdaf90048309
MD5 2d2a41af7d6582fb23999346b0fdc0ff
BLAKE2b-256 9be98fff1104a3b4788f19342e9d7d86f5ec5d88e58834e9155d015a722d95eb

See more details on using hashes here.

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page