一张图表无法显示数据

时间:2017-05-06 17:29:30

标签: javascript ajax django python-3.x chart.js

此图表正确显示如下:

enter image description here

但是这个没有显示栏:

enter image description here

在default2为:

的情况下,此行显示为不正确

未解决的变量default2

修改

我在下面评论过您,看到并添加了显示此错误的图片

enter image description here

修改

如何使上面的图表与其他图片一起显示?

一直在做这些日子和时间,并在这里寻找答案,没有运气。希望你能看到我出错的地方。

新手,所以我感谢你的帮助,伙计们!

修改

enter image description here

修改

enter image description here

chart.js之

printArray(arr[i])

views.py

var endpoint = '/api/chart/data/';
var defaultData = [];
var labels = [];
var defaultData2 = [];
var labels2 = [];

$.ajax({
    method: "GET",
    url: endpoint,
    success: function (data) {
        labels = data.labels;
        defaultData = data.default;
        setChart()
        },
        error: function (error_data) {
            console.log("error");
            console.log(error_data)
        }
    });

$.ajax({
    method: "GET",
    url: endpoint,
    success: function (data) {
        labels2 = data.labels2;
        defaultData2 = data.default2;   # default2 displays error/as incorrect???
        setChart2()
        },
        error: function (error_data) {
            console.log("error");
            console.log(error_data)
        }
    });

function setChart2(){
     var ctx = document.getElementById("myChart5");
        var myChart5 = new Chart(ctx, {
            type: 'bar',
            data: {
                labels2: labels2,
                datasets: [{
                    label: 'Total',
                    data: defaultData2,
                    backgroundColor: [
                        '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(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
                }]
            },
            options: {
                scales: {
                    yAxes: [{
                        ticks: {
                            beginAtZero:true,
                            callback: function(value) {if (value % 1 === 0) {return value;}}
                        }
                    }]
                }
            }
        });}


function setChart(){
     var ctx = document.getElementById("myChart1");
        var myChart1 = new Chart(ctx, {
            type: 'bar',
            data: {
                labels: labels,
                datasets: [{
                    label: 'Total',
                    data: defaultData,
                    backgroundColor: [
                        '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(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
                }]
            },
            options: {
                scales: {
                    yAxes: [{
                        ticks: {
                            beginAtZero:true,
                            callback: function(value) {if (value % 1 === 0) {return value;}}
                        }
                    }]
                }
            }
        });

urls.py

from django.shortcuts import render
from django.views.generic import View
from django.http import JsonResponse
from django.contrib.auth import get_user_model
from SiO.member.models import Member
from SiO.CoAdmin.models import Administrator

from rest_framework.views import APIView
from rest_framework.response import Response

import datetime


User = get_user_model()


class ChartView(View):
    def get(self, request, *args, **kwargs):
        return render(request, 'chart/ChartView.html', {})


class ChartViewMonth(View):
    def get(self, request, *args, **kwargs):
        return render(request, 'chart/ChartView/month.html', {})



class ChartData(APIView):
    def get(self, request, format=None):
        today = datetime.date.today()
        qs_count = Administrator.objects.filter(association=self.request.user.association).count()
        qs_count1 = Member.objects.filter(association=self.request.user.association).count()
        qs_count2 = Member.objects.filter(reg_date__year=today.year,
                                      reg_date__month=today.month).filter(
                                      association=self.request.user.association).count()
        labels2 = ["January"]
        default_items2 = [qs_count2, ]
        labels = ["Board", "Members"]
        default_items = [qs_count, qs_count1]
        data = {
            "labels": labels,
            "default": default_items,
            "labels2": labels2,
            "default2": default_items2,
        }
        return Response(data)

0 个答案:

没有答案