on python, nvd3

Python and Django NVD3


Over the past year, I've built 2 projects related to Charts, Python-NVD3 & Django-NVD3. For those of you who aren't familiar with NVD3 yet, please visit their website (http://nvd3.org/), NVD3 will help you build re-usable and attractive charts with the power of D3.js (http://d3js.org/).

A screenshot of a PieChart created with NVD3 (the real example is interacive):
Example link: http://nvd3.org/examples/pie.html

If you want to play with examples on Jsfiddle?
-> http://jsfiddle.net/areski/z4zuH/246/

Python & Django ?

In my day to day work, I use Python & Django, so I'll let you guess what my next step was. I started building a simple wrapper on top of the NVD3 javascript library. The goals were simple, I needed to simplify injecting charts into my (Django) web projects. Indeed, a lot of my projects have built-in dashboards or reporting tools, having those without a few charts is no fun at all for your users.

NVD3 is a great piece of software and a big thanks to Novus for making this project open source.
Novus released a project that will cover most of my chart needs and maybe yours, they did a great job which lead to a successful open source project with plenty of contributers. Now it was time for me to build something I could use accross my Python projects.

So here comes Python-NVD3: https://github.com/areski/python-nvd3

After the installation of Python-nvd3, you can create a variety of different charts (cumulativeLineChart, discreteBarChart, scatterChart and more).

If you want to create a Piechart Chart with Python-NVD3, here is a quick example:

from nvd3 import pieChart

#Open File to write the D3 Graph
output_file = open('test-nvd3.html', 'w')

type = 'pieChart'  
chart = pieChart(name=type, color_category='category20c', height=450, width=450)  
chart.set_containerheader("\n\n<h2>" + type + "</h2>\n\n")

#Create the keys
xdata = ["Orange", "Banana", "Pear", "Kiwi", "Apple", "Strawberry", "Pineapple"]  
ydata = [3, 4, 0, 1, 5, 7, 3]

#Add the serie
extra_serie = {"tooltip": {"y_start": "", "y_end": " cal"}}  
chart.add_serie(y=ydata, x=xdata, extra=extra_serie)  

#close Html file

Finally, Django-NVD3 is my attempt at using the power of Python-NVD3 within Django's project: https://github.com/areski/django-nvd3

So far, there are a good amount of contributors and I'm really looking forward to seeing how this simple library will grow. If you have ideas, suggestions, feel free to comment here or contact me on twitter @areskib

Yesterday, we released a new version of both projects. Thanks to the help of Justin (https://github.com/jmduke) the javascript output is rendered with Jinja2, which is a much cleaner approach.


Bon Python!

comments powered by Disqus