CODEWITHSUNDEEP
djangopython-3.x
pramod24
pramod24

Reputation: 1116

how to display two graph using django-nvd3

I am using djano-nvd3 libraray for graph displaying in django. I have to display the two chart one for linechart and another is piechart. the xdata[] and ydata[] for the linechart and xdata1[] and ydata1[] for piechart.

view.py

def demo_linechart_without_date(request):

extra_serie = {}
xdata = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
ydata = [3, 5, 7, 8, 3, 5, 3, 5, 7, 6, 3, 1]
xdata1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
ydata1 = [3, 5, 7, 8, 3, 5, 3, 5, 7, 6, 3, 1]
chartdata = {
    'x': xdata,
    'name1': 'series 1', 'y1': ydata, 'extra1': extra_serie,
}
chartdata1 = {
    'x': xdata1,
    'name1': 'series 1', 'y1': ydata1, 'extra1': extra_serie,
}
charttype = "lineChart"
charttype1 = "pieChart"
chartcontainer = 'linechart_container'
chartcontainer1 = 'linechart_container'# container name
data = {
    'charttype': charttype,
    'chartdata': chartdata,
    'chartcontainer': chartcontainer,
    'charttype1': charttype1,
    'chartdata1': chartdata1,
    'chartcontainer1': chartcontainer1,
    'extra': {
        'x_is_date': False,
        'x_axis_format': '',
        'tag_script_js': True,
        'jquery_on_ready': False,
    },
    'extra1': {
        'x_is_date': False,
        'x_axis_format': '',
        'tag_script_js': True,
        'jquery_on_ready': False,
    }
}
return render_to_response('linechart.html', data)

linechart.html 

  {% extends "base.html" %}
  {% block content %}
  {% load nvd3_tags %}
 <head>
{% include_chart_jscss %}
{% if date_tag %}
    {% load_chart charttype chartdata chartcontainer  True "%d %b %Y %H" %}
    {% load_chart charttype1 chartdata1 chartcontainer1  True "%d %b %Y %H" %}
{% else %}
    {% load_chart charttype chartdata chartcontainer extra  %}
    {% load_chart charttype1 chartdata1 chartcontainer1 extra1  %}
{% endif %}
 </head>
 <body>
  {% include_container chartcontainer 400 600 %}
{% include_container chartcontainer1 400 600 %}
 </body>
{% endblock %}

Upvotes: 2

Views: 1260

Answers (2)

Mihai.Mehe
Mihai.Mehe

Reputation: 504

This worked for me:

{% extends "base.html" %}

{% load render_table from django_tables2 %}

{% load static %}

{% block content %}

<div class="col-sm-6">

{% load_chart charttype chartdata chartcontainer %} {% include_container chartcontainer 400 600 %}

</div>

<div class="col-sm-6">

{% load_chart charttype1 chartdata1 chartcontainer1 %}
{% include_container chartcontainer1 400 600 %}

</div>

{% endblock %}

Upvotes: 0

Student Jack
Student Jack

Reputation: 1035

I think there is something wrong with your code.

chartcontainer = 'linechart_container'
chartcontainer1 = 'linechart_container'# container name

if you look at the html code from your generated "linechart.html", there should be two divs with identical id:

div id="linechart_container"

so I would suggest you change

chartcontainer1 = 'linechart_container' (from view.py)

to:

chartcontainer1 = 'linechart_container1'

Upvotes: 4

Related Questions