Implement chartit in Django 1.6 with Python 2.7 -

Question

I have successfully implemented some apps in Django. At the moment I try to implement a chart according to the tutorial: http://chartit.shutupandship.com/docs/#how-to-use.

But I only receive this error message:

Exception Value: 'NoneType' object has no attribute '__getitem__'
Exception Location: /home/administrator/virtualenvs/django27/lib/python2.7/site-packages/chartit/templatetags/chartit.py in load_charts, line 68

The failure appears in this line: hco['chart']['renderTo'] = render_to

Does the error indicate, that render_to is not a dict?

models.py:

Class MonthlyWeatherByCity(models.Model):
    month = models.IntegerField()
    boston_temp = models.DecimalField(max_digits=5, decimal_places=1)
    houston_temp = models.DecimalField(max_digits=5, decimal_places=1)

views.py:

def weather_chart_view(request):
    #Step 1: Create a DataPool with the data we want to retrieve.
    weatherdata = \
        DataPool(
           series=
            [{'options': {
               'source': MonthlyWeatherByCity.objects.all()},
              'terms': [
               'month',
               'houston_temp',
               'boston_temp']}
             ])

    #Step 2: Create the Chart object
    cht = Chart(
            datasource = weatherdata,
            series_options =
              [{'options':{
                  'type': 'line',
                  'stacking': False},
                'terms':{
                  'month': [
                    'boston_temp',
                    'houston_temp']
                  }}],
            chart_options =
              {'title': {
                   'text': 'Weather Data of Boston and Houston'},
               'xAxis': {
                    'title': {
                       'text': 'Month number'}}})

I included the script files, the {{ load block }} in the templates ..

<div id='container'> {{ weatherchart|load_charts:"container" }} </div>

<script type="text/javascript" src="/static/js/jquery-1.11.0.js"></script>
<script type="text/javascript" src="/static/js/highcharts.js"></script>

but that's in my opinion not the problem.

How can I fix it? Thanks!

Answer 1

Try and move the {{ weatherchart|load_charts:"container" }} line out of the div with the id container and into the header, like the example does.

Answer 2

you should modify the template file as below :

    <!-- Include all the required script files here -->

    {% load chartit %}

    {{ weatherchart|load_charts:"container" }}

    <div id="container">{{ weatherchart|load_charts:"container" }}</div>

Answer 3

After some good time wasted, I think the solution is to make the dictionary key returned by your 'view' matche what you have in your template html file. For instance,

   def weather_view(request):
       # other codes
       return render_to_response('charts/graph.html', {'weatherchart': cht})

then your html template follows format as above:

    <div id='container'> {{ weatherchart|load_charts:"container" }} </div>

Also make sure you install simplejson in your virtualenv using: pip install simplejson