如何在python django中向chart.js发送数据？

我正在做一个关于拉用户github API的项目，就像这样

我不知道如何将数据传递给django中的另一个函数

这是我的

视图。py

：

def user(req, username):
    username = str.lower(username)

    # Get User Info

    with urlopen(f'https://api.github.com/users/{username}') as response:
        source = response.read()
    data = json.loads(source)

    # Get Limit Call API

    with urlopen(f'https://api.github.com/rate_limit') as response:
        source = response.read()
    limit_data = json.loads(source)

    # Get User Repo Info
    with urlopen(f'https://api.github.com/users/{username}/repos') as response:
        source = response.read()
    sorted_by_stars = json.loads(source)
    sorted_by_forks = json.loads(source)
    sorted_by_size = json.loads(source)
    # Sorted by stars

    def sort_user_repo_by_stars(sorted_by_stars):
        return sorted_by_stars['stargazers_count']

    sorted_by_stars.sort(key=sort_user_repo_by_stars, reverse=True)

    # Sorted by forks
    def sort_user_repo_by_forks(sorted_by_forks):
        return sorted_by_forks['forks']

    sorted_by_forks.sort(key=sort_user_repo_by_forks, reverse=True)

    # Sorted by size
    def sort_user_repo_by_size(sorted_by_size):
        return sorted_by_size['size']

    sorted_by_size.sort(key=sort_user_repo_by_size, reverse=True)

    created_at = data['created_at']
    created_at = datetime.datetime.strptime(created_at, "%Y-%m-%dT%H:%M:%SZ")
    created_at = created_at.strftime("%B %d, %Y")

    context = {
        'username': username,
        'data': data,
        'created_at': created_at,
        'limit_data': limit_data,
        'sorted_by_stars': sorted_by_stars[:8],
        'sorted_by_forks': sorted_by_forks[:8],
        'sorted_by_size': sorted_by_size[:8],
    }
    return render(req, 'user.html', context)


class ChartData(APIView):
    authentication_classes = []
    permission_classes = []

    def get(self, request, format=None):
        labels = ["Blue", "Yellow", "Green", "Purple", "Orange"]
        default_items = [23, 2, 3, 12, 2]
        data = {
            "labels": labels,
            "default": default_items,
        }
        return Response(data)

from django.urls import path
from . import views
from .views import ChartData

urlpatterns = [
    path('', views.index),
    path('search', views.searchUser),
    path('<username>', views.user),
    path('api/chart/data/', ChartData.as_view(), name='api-data'),
]

这是我的

url.py

：

def user(req, username):
    username = str.lower(username)

    # Get User Info

    with urlopen(f'https://api.github.com/users/{username}') as response:
        source = response.read()
    data = json.loads(source)

    # Get Limit Call API

    with urlopen(f'https://api.github.com/rate_limit') as response:
        source = response.read()
    limit_data = json.loads(source)

    # Get User Repo Info
    with urlopen(f'https://api.github.com/users/{username}/repos') as response:
        source = response.read()
    sorted_by_stars = json.loads(source)
    sorted_by_forks = json.loads(source)
    sorted_by_size = json.loads(source)
    # Sorted by stars

    def sort_user_repo_by_stars(sorted_by_stars):
        return sorted_by_stars['stargazers_count']

    sorted_by_stars.sort(key=sort_user_repo_by_stars, reverse=True)

    # Sorted by forks
    def sort_user_repo_by_forks(sorted_by_forks):
        return sorted_by_forks['forks']

    sorted_by_forks.sort(key=sort_user_repo_by_forks, reverse=True)

    # Sorted by size
    def sort_user_repo_by_size(sorted_by_size):
        return sorted_by_size['size']

    sorted_by_size.sort(key=sort_user_repo_by_size, reverse=True)

    created_at = data['created_at']
    created_at = datetime.datetime.strptime(created_at, "%Y-%m-%dT%H:%M:%SZ")
    created_at = created_at.strftime("%B %d, %Y")

    context = {
        'username': username,
        'data': data,
        'created_at': created_at,
        'limit_data': limit_data,
        'sorted_by_stars': sorted_by_stars[:8],
        'sorted_by_forks': sorted_by_forks[:8],
        'sorted_by_size': sorted_by_size[:8],
    }
    return render(req, 'user.html', context)


class ChartData(APIView):
    authentication_classes = []
    permission_classes = []

    def get(self, request, format=None):
        labels = ["Blue", "Yellow", "Green", "Purple", "Orange"]
        default_items = [23, 2, 3, 12, 2]
        data = {
            "labels": labels,
            "default": default_items,
        }
        return Response(data)

from django.urls import path
from . import views
from .views import ChartData

urlpatterns = [
    path('', views.index),
    path('search', views.searchUser),
    path('<username>', views.user),
    path('api/chart/data/', ChartData.as_view(), name='api-data'),
]

我想制作一个顶级语言使用图表，如我下面链接的链接

在python django中如何实现这一点

---

我非常感谢

为了让您的后端和前端通信，您可以在两者之间使用某种RESTAPI。这是一个完整的主题，所以这里有一个解决方案，以实现您想要的一个简单的方式

django服务器正在向客户端提供HTML文件。这些HTML文件在django世界中称为“模板”，因为它们是由服务器呈现的。遗憾的是，一旦提供给客户机，您就不能再在这些页面上执行python了。。。我必须找到另一条路。这里有一个想法：

由于可以在HTML文件中键入JavaScript，因此可以让django以JavaScript可以理解的方式呈现数据。例如JSON，甚至直接使用JavaScript代码。请记住，这通常被视为一种不好的做法，因为它会使bug更难找到

在我们的例子中，我们只需要两样东西：

x

和

y

值

以下是如何在python中生成这些脚本，以便将其转换为JavaScript：

labels = ['a', 'b', 'c', 'd', 'e']
values = [0, 0, 0, 0, 0]

return render('our_template.html', {
   'x': json.dumps(labels),
   'y': json.dumps(values),
})

这是我们可以在模板中编写的内容，用于将数据存储为普通JavaScript变量：

let x = {{ x|safe }}; // this is django template markup language right here
let y = {{ y|safe }}; // it will get evaluated before returning the template to the client

上述代码将呈现为：

let x = ['a', 'b', 'c', 'd', 'e'];
let y = [0, 0, 0, 0, 0];

下面是如何使用它们制作一个简单的条形图：

window.addEventListener("DOMContentLoaded", event => {
    let label = "My chart";
    let ctx = document.getElementById('my-chart').getContext('2d');
    let accessLogChart = new Chart(ctx, {
        type: 'bar',
        data: {
            labels: x,
            datasets: [{
                label: label,
                data: y,
            }]
        },
    });
});

---

我试图添加

let x=“{x|safe}”；让y={y | safe}}

在我的脚本标记中，但它给了我这个错误

声明或语句。javascript

为什么在引号（

“

”）之间放置

x

）？这不起作用，你应该删除它们：

让x=“{x | safe}”

变成

让x={x{safe}；