Question

我想将图表放在网络中心。但我发现无论我做了什么，只要留在那里坚持网络的左侧。这是我的代码：

models.py

class User_Data(models.Model):
    user = models.CharField(max_length=20)
    word = models.CharField(max_length=255)
    click_times = models.IntegerField(default=0)

    class Meta:
        ordering = ('user',)

    def __unicode__(self):
        return unicode(self.user)

views.py的代码如下。我只是遵循http://chartit.shutupandship.com的课程而且我真的得到了图表。

def userdata_chart_view(request):

    userdata = \
        DataPool(
            series=
            [{'options': {
                'source': User_Data.objects.filter(user=request.user.username)},
                'terms': [
                    'user',
                    'word',
                    'click_times']}
            ])

    cht = Chart(
        datasource= userdata,
        series_options =
            [{'options':{
                'type': 'column',
                'stacking': False},
            'terms':{
                'word': [
                    'click_times']},
            }],
        chart_options=
        {'title': {'text': '搜索频率'},
         'xAxis': {'title': {'text': '词条'}},
         'yAxis': {'title': {'text': '频率'}},
         }
    )

    content1 = {'user_data_chart': cht}
    return render(request, 'yigu/charts.html', content1)

这里是chart.html

{% extends 'yigu/base_charts.html' %}

{% block body_block %}
<br />
<div class="container">
  <div class="row">
    <div class="col-md-4">
      <div id="charts" style="width:450px">
      </div>
    </div>
  </div>
</div>
{% endblock %}

虽然我已经通过谷歌搜索了解决方案，但我不知道如何计算中心问题。有人可以帮帮我吗？

Answer 1

Bootstrap grid system有12个col。你只定义了4个col。

<div class="container">
  <div class="row">
    <div class="col-md-4"></div>
    <div class="col-md-4">
      <div id="charts" style="width:450px">
          &nbsp;
      </div>
    </div>
    <div class="col-md-4"></div>
  </div>
</div>

如何在使用django-chartit时将图表放在中心？

1 个答案: