Django Module for FusionCharts

Add interactive charts to your application using Django plugin for FusionCharts.

Create Line, Area, Pie, Bar, Column, Gantt and over 150 charts for your web application using the Django Plugin for FusionCharts. Unlike other charting libraries that only allow creation of static images with low resolution, our charts are completely interactive and responsive on all screen sizes. Stop worrying about JSON parsing or JavaScript methods, simply write your implementation in Python, fetch data from your MySQL server and directly create charts which are responsive, interactive, and, support zooming, panning, APIs, animation, drill-downs, real-time updates, and full exporting of charts & dashboards, all in your own server!

Our Django Plugin comes with event support for mouse, keyboard, and more, enabling you to add charts in runtime during any lifecycle phase of the application. All our charts are mobile first by default, and responsive across all devices. Further, all charts & graphs are tested and built for millions of data points, without any performance issues.

Features

  • Enjoy support for key FusionCharts features like annotations, macros, themes, image-export, and more.
  • Execute projects without writing separate API for your JavaScript application.
  • SQL or NoSQL, connect your chart directly to database of your choice.
  • Add data in a number of ways, JSON or XML.

Quick Demo

Simple chart
Quick demo

Quick Start

Step 1 : Install the FusionCharts Django Module

  • Download FusionCharts library
  • Unzip the archive and move to integrations > django > fusioncharts-wrapper-source to get the fusioncharts.py file.
  • Copy fusioncharts.py to static folder inside your project.
  • Start rendering charts using the classes and methods under the FusionCharts namespace.

Step 2 : Include FusionCharts JavaScript library in your page

Assuming you have the FusionCharts library placed inside the static/fusioncharts folder in your project, write a script tag in the section of the page where you want to add the source of the FusionCharts library link from the local folder.

{% load static %} 
<script type="text/javascript" src="{% static "fusioncharts/fusioncharts.js" %}"></script>

Step 3 : Include the module source file (fusioncharts.py) in your project

Include the fusioncharts.py file which has required functions to embed the charts in html page

from fusioncharts import FusionCharts

Step 4 : Render your chart

# Filename: app_name/views.py

# Include the `fusioncharts.py` file which has 
# required functions to embed the charts in html page
from fusioncharts import FusionCharts

# The `chart` method is defined to load chart data from an JSON string.
def chart(request):
    # Create an object for the column2d chart using the FusionCharts class constructor
    column2d = FusionCharts("column2d", "ex1" , "600", "400", "chart-1", "json",
         # The data is passed as a string in the `dataSource` as parameter.
        """{  
               "chart": {  
                  "caption":"Harry\'s SuperMart",
                  "subCaption":"Top 5 stores in last month by revenue",
                  "numberPrefix":"$",
                  "theme":"ocean"
               },
               "data": [  
                    {"label":"Bakersfield Central", "value":"880000"},
                    {"label":"Garden Groove harbour", "value":"730000"},
                    {"label":"Los Angeles Topanga", "value":"590000"},
                    {"label":"Compton-Rancho Dom", "value":"520000"},
                    {"label":"Daly City Serramonte", "value":"330000"}
                ]
            }""")

    # returning complete JavaScript and HTML code, 
    # which is used to generate chart in the browsers.
    return  render(request, 'index.html', {'output' : column2d.render()})

Render the chart

<!-- Filename: app_name/templates/index.html -->
<h3>FusionChart</h3>
<div id="chartContainer">{{ output|safe }}</div>

Licensing

Django FusionCharts module is open-source and distributed under the terms of the MIT/X11 License. You will still need to download and include FusionCharts in your page. This project provides no direct functionality. You can download a free evaluation version. However, You will need to purchase a FusionCharts license to use in a commercial environment (FusionCharts is free for non-commercial and personal use).