ipyvizzu - Jupyter notebook integration of Vizzu

Overview

Vizzu

ipyvizzu - Jupyter notebook integration of Vizzu.

Tutorial · Examples · Repository

PyPI version CI check

About The Project

ipyvizzu is the Jupyter Notebook integration of Vizzu. ipyvizzu enables data scientists and analysts to utilize animation for storytelling with data using Python.

Similar to Vizzu, which is a free, open-source Javascript/C++ library, ipyvizzu also utilizes a generic dataviz engine that generates many types of charts and seamlessly animates between them. It is designed for building animated data stories as it enables showing different perspectives of the data that the viewers can easily follow.

Main features:

  • Designed with animation in focus;
  • Defaults based on data visualization guidelines;
  • Works with Pandas dataframe, also JSON and inline data input is available;
  • Auto scrolling to keep the actual chart in position while executing multiple cells.

Installation

ipyvizzu requires IPython and pandas packages. However you can use it only in Jupyter Notebook therefore notebook project has to be installed.

pip install ipyvizzu
pip install notebook

You can also use ipyvizzu by locally installing Vizzu, you can find more info about this in the documentation

Usage

ipyvizzu only works in Jupiter Notebook environment. A notebook cell may contain the following code snippet resulting in the animation below.

import pandas as pd
from ipyvizzu import Chart, Data, Config

data_frame = pd.read_csv('titanic.csv')
data = Data()
data.add_data_frame(data_frame)

chart = Chart(width="640px", height="360px")

chart.animate(data)

chart.animate(Config({"x": "Count", "y": "Sex", "label": "Count","title":"Passengers of the Titanic"}))
chart.animate(Config({"x": ["Count","Survived"], "label": ["Count","Survived"], "color": "Survived"}))
chart.animate(Config({"x": "Count", "y": ["Sex","Survived"]}))

ipyvizzu

Visit our documentation site for more details and a step-by-step tutorial into ipyvizzu, or check out the example gallery.

Tools Support

ipyvizzu can also be used within Google Colab, Deepnote and Kaggle Notebooks! Check out the demo links below 👇

  • Open in Collab

  • View in Deepnote

  • Open in Kaggle

  • Open in Mercury

Contributing

We welcome contributions to the project, visit our contributing guide for further info.

Contact

License

Copyright © 2022 Vizzu Kft..

Released under the Apache 2.0 License.

Comments
  • change doc online version

    change doc online version

    I have a question about the online version of the documentation.

    If I change something in a ipynb file in doc/examples, after that I need to run make doc and commit changed htmls if I want to update the site too? (In that case I do not understand clearly what pages-build-deployment workflow do.)

    documentation 
    opened by veghdev 14
  • ipyvizzu.Chart.animation: allow distinct animations

    ipyvizzu.Chart.animation: allow distinct animations

    All Animation has a main key (Data => "data", Config => "config") therefore it is quite straightforward to merge different animation in one Chart.animate call. Therefore Chart.animate can allow multiple animations until they do not override any data.

    The *animations and **config can be merged with this strategy, too and the *args and **kwargs calls will lokk similar:

    Chart().animate(config={...}, data={...})

    Chart().animate(Config(...), Data(...))

    opened by nyirog 7
  • Refactor ipyvizzu.Chart.animate() to handle animoptions

    Refactor ipyvizzu.Chart.animate() to handle animoptions

    ipyvizzu.Chart.animate() can not handle animoptions (like delay, duration etc.).

    The JS API accepts the following arguments: animate({ data, config, style }, animoptions) animate(config, animoptions) animate({ data, config, style }) animate(config)

    ipyvizzu's behavior do not need to be the same like the JS API, so it can be pythonic, but the functions have to work. (animoptions is a js object like a python dict, or in js api it can be a single string if only want to change the duration so '500ms' instead of {duration: '500ms'})

    I think possible solutions in ipyvizzu are:

    I. kwargs only be animoptions style, data and config only be Style, Data, Config classes in args (it is a further problem with this, Style(None) needs to work to reset previous style modifications, but now it is working only in kwargs style=None)

    II. create az animOptions class, and handle it differently in _merge_animations()

    III. any other idea

    enhancement 
    opened by veghdev 6
  • docs: examples generator scripts

    docs: examples generator scripts

    Usage:

    cd tools/example-generator
    npm intall
    pip install -r requirements.txt
    ./run.sh
    

    Sparse clones/checks out the vizzu-lib repo to the current folder. Generates ipynb files for each example file found in the vizzu-lib repo test/integration/test_cases/web_content/sample_static/*.mjs, test/integration/test_cases/web_content/templates/*.mjs into docs/examples/static, docs/examples/animated folders

    opened by simzer 5
  • How to loop the animation? Add controls?

    How to loop the animation? Add controls?

    This is a great library! Exactly the lib that I was looking for! Thank you! :1st_place_medal:

    How to run the animation in the loop? Can I add controls for animation (stop, play)?

    I'm working on a framework for converting Jupyter Notebooks to interactive web apps. Would love to use vizzu in demos. I will let you know, thanks!

    enhancement 
    opened by pplonski 3
  • No scroll in case of user scroll

    No scroll in case of user scroll

    If the notebook is running and the user scrolls, then auto scrolling should switch off for that run. It is inconvenient for the user that they couldn't scroll during running.

    Something like this would be the solution:

    global scope:

    let inhibitScroll = false;
    document.addEventListener('scroll', function(e) {
      inhibitScroll = true;
    });
    

    cell:

    if (!inhibitScroll) myVizzu.scrollIntoView(...);
    

    I don't how to set inhibitScroll back to false after running, but next run should do autoscrolling again.

    enhancement 
    opened by simzer 3
  • ipyvizzu.Chart.animation: allow animoptions, kwargs can only be animo…

    ipyvizzu.Chart.animation: allow animoptions, kwargs can only be animo…

    …ptions

    • [x] refactor Chart.animate

    • [x] fix unit tests

    • [x] add unit tests to anim options

    • [x] fix examples

    • [x] add examples to anim options

    • [x] load data in the examples

    opened by veghdev 3
  • Generate ipynb from python and markdown assets

    Generate ipynb from python and markdown assets

    The notebooks (ipynb) inculdes the markdown and code cells as list of lines. Editing the notebook is error prone therefore we should read the cells from separate assets.

    A notebook

    {                                                                                                                                                                                                                      
      "cells": [                                                                                 
        {                                                                                         
           "cell_type": "markdown",                                                              
           "id": "e582c95b",                                                                     
           "metadata": {},                                                                       
           "source": [                                                                           
              "## Aggregate/drill-down\n",                                                         
              "\n",                                                                                
              "These features basically mean that you add or remove an additional dimension to/from an axis or another channel. As you can see below, there are some important things to keep in mind when you use them.\n",
              "\n",                                                                                
              "Let’s stack together the elements by putting the Genres dimension from the x-axis to the y-axis. At the end of this phase, there are chart elements with the same color stacked on top of each other, which is something you would want to avoid. "
          ]                                                                                     
        }
      ]
    }
    

    would be split into a json and markdown/python files

    {                                                                                                                                                                                                                      
      "cells": [                                                                                 
        {                                                                                         
          "cell_type": "markdown",                                                              
          "id": "e582c95b",                                                                     
          "metadata": {},                                                                       
          "source": {"@readlines": "aggregate.md"}
        }
      ]                                                                                     
    }
    
    ## Aggregate/drill-down
    
    These features basically mean that you add or remove an additional dimension to/from an axis or another channel. As you can see below, there are some important things to keep in mind when you use them.
    
    Let’s stack together the elements by putting the Genres dimension from the x-axis to the y-axis. At the end of this phase, there are chart elements with the same color stacked on top of each other, which is something you would want to avoid.
    

    The {"@readlines": "aggregate.md"} would be handle by a simple python script with the json.load object_hook. And the Makefile would genearte ipynb from the json template:

    #!/usr/bin/env python3
    """
    Replace `{"@readlines": "referred/file"}` object from the `json_file` with the
    list of lines read from the referred file. The path of the referred file is
    relative to the `json_file`.
    """
    
    import argparse
    import json
    import sys
    import pathlib
    
    
    def main():
        args = _parse_args()
        reader = Reader(args.json_file.parent)
    
        with args.json_file.open() as fp:
            obj = json.load(fp, object_hook=reader.object_hook)
    
        json.dump(obj, fp=sys.stdout, indent=4, sort_keys=True)
    
    
    def _parse_args():
        parser = argparse.ArgumentParser(
            description="Read files as list of lines into json", epilog=__doc__
        )
        parser.add_argument("json_file", type=pathlib.Path)
    
        return parser.parse_args()
    
    
    class Reader:
        def __init__(self, source_dir):
            self._source_dir = source_dir
    
        def object_hook(self, obj):
            if len(obj) != 1:
                return obj
    
            try:
                path = obj["@readlines"]
            except KeyError:
                return obj
    
            file_name = self._source_dir / path
    
            with file_name.open() as fp:
                return fp.readlines()
    
    
    if __name__ == "__main__":
        exit(main())
    
    documentation 
    opened by nyirog 3
  • question: does ipyvizzu work in PyCharm

    question: does ipyvizzu work in PyCharm

    PyCharm is a popular Python IDE, it would be great to see if ipyvizzu and ipyvizzu-story work in it. Pic: Kaggle State of Data Science and Machine Learning Survey 2022 image

    question 
    opened by petervidos 2
  • Add `conda` install option for `ipyvizzu`

    Add `conda` install option for `ipyvizzu`

    A conda install option could be very helpful. Adding ipyvizzu to conda-forge channel will be ideal.

    Note: I have started working on this already in the following PR.

    • https://github.com/conda-forge/staged-recipes/pull/19838

    Once merged you will be able to install the library with:

    conda install -c conda-forge ipyvizzu
    
    enhancement 
    opened by sugatoray 2
  • put readme into documentation and setup domains.

    put readme into documentation and setup domains.

    Please put all content from the readme to the github pages index page (https://vizzuhq.github.io/ipyvizzu/index.html). Including a link to the github repo. See vizzu-lib for reference, where the repo readme is the same as the lib.vizzuhq.com index page. 2. Please create an ipyvizzu.vizzuhq.com subdomain and direct it to the ipyvizzu project's github pages site. 3. We have the ipyvizzu.com domain now, please redirect it to ipyvizzu.vizzuhq.com

    documentation 
    opened by simzer 2
  • MkDocs - theme

    MkDocs - theme

    Change the mkdocs theme to resemble the vizzu lib doc site https://lib.vizzuhq.com/0.4/

    • [x] colors, font-sizes
    • [x] add vizzu logo, favicon
    • [x] syntax highlight
    • [ ] add social logos/links
    documentation 
    opened by simzer 4
  • Tutorial Notebook for setting Chart Styles

    Tutorial Notebook for setting Chart Styles

    Please let me know if I'm misunderstanding some of how this works!

    My current understanding is the documentation for updating Styles for charts is present in the JS Vizzu library, but not super clear for the ipyvizzu.

    My PR #200 adds a small Style tweak, but I think a full tutorial on Style properties and how to change them could help a lot, especially to explain a little of how python users can leverage the js documentation to customize plots. If this seems valuable, I would be happy to take a shot of making such a notebook. If so - feel free to tag me as the Assignee, but if not or if this documentation already exists feel free to close 👍

    documentation 
    opened by parkerkain-8451 1
  • Multi-tiered x-axes labels

    Multi-tiered x-axes labels

    This can be replicated by following the plots in the sorting tutorial notebook.

    As you follow along, the second to last plot looks like this:

    image

    and the final plot looks like:

    image

    Here - I think ideally, the final plot would have multi-tiered x axis labels, as by default it is impossible to know what each of the Genre bars within a Kind represent.

    question 
    opened by parkerkain-8451 0
  • Enable Makefile to run properly on OSX

    Enable Makefile to run properly on OSX

    Currently - Mac users cannot run any of the make commands for the repo - which forces repo maintainers to reformat code written by Mac users.

    This applies to both ipyvizzu and ipyvizzu-story

    enhancement 
    opened by parkerkain-8451 0
  • Enable the use of spark dataframes

    Enable the use of spark dataframes

    Enable users to use Spark dataframe next to the currently available pandas dataframe. More info: https://spark.apache.org/docs/3.1.1/api/python/reference/api/pyspark.sql.DataFrame.html

    enhancement 
    opened by petervidos 1
Releases(0.13.0)
Owner
Vizzu
Vizzu
A minimalistic wrapper around PyOpenGL to save development time

glpy glpy is pyOpenGl wrapper which lets you work with pyOpenGl easily.It is not meant to be a replacement for pyOpenGl but runs on top of pyOpenGl to

Abhinav 9 Apr 02, 2022
Dimensionality reduction in very large datasets using Siamese Networks

ivis Implementation of the ivis algorithm as described in the paper Structure-preserving visualisation of high dimensional single-cell datasets. Ivis

beringresearch 284 Jan 01, 2023
It's an application to calculate I from v and r. It can also plot a graph between V vs I.

Ohm-s-Law-Visualizer It's an application to calculate I from v and r using Ohm's Law. It can also plot a graph between V vs I. Story I'm doing my Unde

Sihab Sahariar 1 Nov 20, 2021
Moscow DEG 2021 elections plots

Построение графиков на основе публичных данных о ДЭГ в Москве в 2021г. Описание Скрипты в данном репозитории позволяют собственноручно построить графи

9 Jul 15, 2022
A Jupyter - Leaflet.js bridge

ipyleaflet A Jupyter / Leaflet bridge enabling interactive maps in the Jupyter notebook. Usage Selecting a basemap for a leaflet map: Loading a geojso

Jupyter Widgets 1.3k Dec 27, 2022
📊📈 Serves up Pandas dataframes via the Django REST Framework for use in client-side (i.e. d3.js) visualizations and offline analysis (e.g. Excel)

📊📈 Serves up Pandas dataframes via the Django REST Framework for use in client-side (i.e. d3.js) visualizations and offline analysis (e.g. Excel)

wq framework 1.2k Jan 01, 2023
Movie recommendation using RASA, TigerGraph

Demo run: The below video will highlight the runtime of this setup and some sample real-time conversations using the power of RASA + TigerGraph, Steps

Sudha Vijayakumar 3 Sep 10, 2022
Jupyter notebook and datasets from the pandas Q&A video series

Python pandas Q&A video series Read about the series, and view all of the videos on one page: Easier data analysis in Python with pandas. Jupyter Note

Kevin Markham 2k Jan 05, 2023
An interactive GUI for WhiteboxTools in a Jupyter-based environment

whiteboxgui An interactive GUI for WhiteboxTools in a Jupyter-based environment GitHub repo: https://github.com/giswqs/whiteboxgui Documentation: http

Qiusheng Wu 105 Dec 15, 2022
Statistics and Visualization of acceptance rate, main keyword of CVPR 2021 accepted papers for the main Computer Vision conference (CVPR)

Statistics and Visualization of acceptance rate, main keyword of CVPR 2021 accepted papers for the main Computer Vision conference (CVPR)

Hoseong Lee 78 Aug 23, 2022
Calendar heatmaps from Pandas time series data

Note: See MarvinT/calmap for the maintained version of the project. That is also the version that gets published to PyPI and it has received several f

Martijn Vermaat 195 Dec 22, 2022
Python script for writing text on github contribution chart.

Github Contribution Drawer Python script for writing text on github contribution chart. Requirements Python 3.X Getting Started Create repository Put

Steven 0 May 27, 2022
A filler visualizer built using python

filler-visualizer 42 filler のログをビジュアライズしてスポーツさながら楽しむことができます! Usage (標準入力でvisualizer.pyに渡せばALL OK) 1. 既にあるログをビジュアライズする $ ./filler_vm -t 3 -p1 john_fill

Takumi Hara 1 Nov 04, 2021
The Metabolomics Integrator (MINT) is a post-processing tool for liquid chromatography-mass spectrometry (LCMS) based metabolomics.

MINT (Metabolomics Integrator) The Metabolomics Integrator (MINT) is a post-processing tool for liquid chromatography-mass spectrometry (LCMS) based m

Sören Wacker 0 May 04, 2022
This plugin plots the time you spent on a tag as a histogram.

This plugin plots the time you spent on a tag as a histogram.

Tom Dörr 7 Sep 09, 2022
Implement the Perspective open source code in preparation for data visualization

Task Overview | Installation Instructions | Link to Module 2 Introduction Experience Technology at JP Morgan Chase Try out what real work is like in t

Abdulazeez Jimoh 1 Jan 23, 2022
This package creates clean and beautiful matplotlib plots that work on light and dark backgrounds

This package creates clean and beautiful matplotlib plots that work on light and dark backgrounds. Inspired by the work of Edward Tufte.

Nico Schlömer 205 Jan 07, 2023
Because trello only have payed options to generate a RunUp chart, this solves that!

Trello Runup Chart Generator The basic concept of the project is that Corello is pay-to-use and want to use Trello To-Do/Doing/Done automation with gi

Rômulo Schiavon 1 Dec 21, 2021
GD-UltraHack - A Mod Menu for Geometry Dash. Specifically a MegahackV5 clone in Python. Only for Windows

GD UltraHack: The Mod Menu that Nobody asked for. This is a mod menu for the gam

zeo 1 Jan 05, 2022
web application for flight log analysis & review

Flight Review This is a web application for flight log analysis. It allows users to upload ULog flight logs, and analyze them through the browser. It

PX4 Drone Autopilot 145 Dec 20, 2022