Имена меток ChartJS не отображаются, просто идентификатор

Я искал эту тему пару дней и недавно добился больших успехов благодаря помощи моих друзей на SO. Я не мог заставить данные отображаться правильно, и теперь это происходит. Последняя оставшаяся часть — правильное отображение меток. Я обнаружил аналогичную проблему и подозреваю, что смогу использовать массив, но не могу понять синтаксис. Это аналогичная проблема. передача каждого элемента массива в метках char .js — это код, который работает нормально, только он отображает идентификатор внешних ключей, а не фактическое имя. Если я удаляю .id из цикла меток диаграммы, диаграмма вообще не отображается. По какой-то причине я не могу получить доступ к имени данных, только к идентификатору. Заранее спасибо за помощь.

Мой HTML

{% extends 'base5.html' %}

{% block body_block %}
<div class="box6">
          <h1 class="title">Number of Books By Author</h1>
<canvas id="myChart"></canvas>
<div>

  <script>
  var endpoint = '{% url "Books:chart_data" %}'
  var defaultData = [];
  var labels = [];
  array = {{ procedures3 }}
  $.ajax({
      method: "GET",
      credentials: 'same-origin',
      url: endpoint,
      success: function(data){
          defaultData = data.default
          var ctx = document.getElementById("myChart");
          var myChart = new Chart(ctx, {
              type: 'bar',
              data: {
                  labels: [{% for i in book %}{{ i.id }},{% endfor %}],
                  datasets: [{
                      label: "# of Procedures",
                      data: [{% for j in book_count %}
                               {{ j }},
                             {% endfor %}],
                      backgroundColor: [
                          'rgba(255, 99, 132, 0.2)',
                          'rgba(255, 99, 132, 0.2)',
                          'rgba(54, 162, 235, 0.2)',
                          'rgba(255, 206, 86, 0.2)',
                          'rgba(75, 192, 192, 0.2)',
                          'rgba(153, 102, 255, 0.2)',
                          'rgba(255, 159, 64, 0.2)'
                      ],
                      borderColor: [
                          'rgba(255,99,132,1)',
                          'rgba(255,99,132,1)',
                          'rgba(54, 162, 235, 1)',
                          'rgba(255, 206, 86, 1)',
                          'rgba(75, 192, 192, 1)',
                          'rgba(153, 102, 255, 1)',
                          'rgba(255, 159, 64, 1)'
                      ],
                      borderWidth: 1
                  }]
              }
          })
      },
      error: function(error_data){
          console.log("error")
          console.log(error_data)
      },
  })
  </script>
  {% endblock %}

Диаграмма

class ChartData(LoginRequiredMixin,APIView):
    model = Author
    authentication_classes = (SessionAuthentication, BasicAuthentication)
    permission_classes = (IsAuthenticated,)

    def get(self, request, format=None):
        default_items = []
        labels = []
        data = {
            "labels": labels,
            "default": default_items,
        }
        return Response(data)

Представление диаграммы

class ChartView(LoginRequiredMixin, TemplateView):
template_name = 'Book/chart.html'

def get_context_data(self, **kwargs):
    context = super(ChartView, self).get_context_data(**kwargs)
    book = Author.objects.filter(id__in=self.request.user.userprofile.author.all()).order_by('id')
    books_count = [ Book.objects.filter(author=cls).count() for cls in book ]
    context['book'] = book
    context['book_count'] = books_count
    return context

Последняя часть для меня - выяснить, как получить имена книг вместо идентификаторов внешнего ключа, которые я получаю с помощью этой строки кода:

       labels: [{% for i in book %}{{ i.id }},{% endfor %}],

Кажется, я не могу получить доступ к имени, даже если я наберу i.name или i.book_name или что-то еще, что я могу придумать. После дальнейшего поиска я считаю, что мне нужно выполнить обратный поиск имени, все еще пробуя несколько подходов. Заранее благодарны за Вашу помощь.


person Steve Smith    schedule 26.06.2018    source источник


Ответы (1)


Имя поля, на которое следует ссылаться, должно быть определено в вашем файле «models.py» — неясно, уверены ли вы, что i.name или i.book_name уже определены, или вы предполагаете. Это имя столбца в исходной таблице базы данных. Если на самом деле это b_name или title или что-то в этом роде, вам нужно будет использовать это специально.

Другое дело, что вам могут понадобиться кавычки вокруг строк в списке меток и, возможно, встроенный тег шаблона 'escapejs', если в строке, заключенной в кавычки, есть специальные символы, которые могут вызвать проблемы.

поэтому попробуйте что-то вроде (название только мое предположение):

labels: [{% for i in book %}'{{ i.title|escapejs }}',{% endfor %}]
person Atcrank    schedule 26.06.2018
comment
Цитаты сделали свое дело! Я знал это имя, просто не мог его произнести. Это простое изменение помогло! Большое спасибо!!!!!! escapejs не нужен. - person Steve Smith; 26.06.2018