【问题标题】:Getting {% load chartit %} on my browser. Charts are not loading using chartit在我的浏览器上获取 {% load chartit %}。图表未使用 chartit 加载
【发布时间】:2017-09-15 13:02:21
【问题描述】:

我正在使用Django Chartit 显示图表,Cassandra 3.0 是我的数据库。

我尝试渲染折线图,但它没有显示图表,而是显示{% load chartit %}。请提出一些建议。我用谷歌搜索过,但没有帮助。

我认为 HTML 中的代码是正确的。但我不知道出了什么问题。

以下是补充:

Models.py

    # -*- coding: utf-8 -*-
from __future__ import unicode_literals

# -*- coding: utf-8 -*-

from django.db import models

# Create your models here.

from cassandra.cqlengine import columns
from django_cassandra_engine.models import DjangoCassandraModel


class PqpModel(DjangoCassandraModel):

    prd_id = columns.BigInt(primary_key=True)

    X_01 = columns.Decimal()

    X_02 = columns.Decimal()

    X_03 = columns.Decimal()

    X_04 = columns.Decimal()

    X_05_1 = columns.Decimal()

    X_05_10 = columns.Decimal()

    X_05_11 = columns.Decimal()

    X_05_12 = columns.Decimal()

urls.py

from django.conf.urls import url, include

from . import views

urlpatterns = [
    url(r'^$', views.index, name='index'),
]

views.py

# -*- coding: utf-8 -*-
from __future__ import unicode_literals

from django.shortcuts import render

from django.db import models

from cassandra.cqlengine import connection

from cassandra.cqlengine.management import sync_table

from cassandra.cluster import Cluster

from chartit import DataPool, Chart

from models import PqpModel

from django.http import HttpResponse


# Create your views here.

from django.http import HttpResponse

# def index(request):
#     cluster = Cluster(['127.0.0.1'])
#     session = cluster.connect()
#     session.set_keyspace('samplepqp')
    #return HttpResponse(session.execute("""SELECT * FROM qsp_recreate"""))
   # insert = PqpModel(prd_id="7859654564465465")
   # insert.save()
   #  cluster.shutdown()

def pqp_line_chart(request):
        cluster = Cluster(['127.0.0.1'])
        session = cluster.connect()
        session.set_keyspace('samplepqp')
        cluster.shutdown()
        #1: Create a DataPool or PivotDataPool object that specifies what data you need to retrieve and from where.
        ds = DataPool(
            series=[{'options': {
                'source': PqpModel.objects.all()},
                'terms': [
                    'prd_id',
                    'X_01',
                    'X_05_1']}
            ])

        # Step 2: Create the Chart object

        cht = Chart(

            datasource=ds,

            series_options=
            [{
                'options': {

                    'type': 'line',
                    'stacking': False},
                'terms': {
                    'prd_id': [
                        'X_01',
                        'X_05_1']

                }}],

            chart_options=
            {'title': {
                'text': 'QSPRAW DATA 7'},
                'xAxis': {
                    'title': {
                        'text': 'prd id data'}}})

        #return render({'qspraw7_data/index.html': cht})

        return render(request, {'pqpchart': cht})

index.html

  <html>
 <head>
 <script type=”text/javascript” src=”/media/js/jquery-1.7.1.js”></script>
 <script type=”text/javascript” src=”/media/js/Highcharts-2.1.9/js/highcharts.js”></script>
 {% load chartit %}

 </head>
 <body>
 <div id=”container”>
     {{ pqpChart|load_charts:”container” }}
     </div>
 </body>
 </html>

【问题讨论】:

    标签: html django highcharts


    【解决方案1】:

    您的 HTML 模板应如下所示:

    <head>
    <script type=”text/javascript” src=”/media/js/jquery-1.7.1.js”></script>
     <script type=”text/javascript” src=”/media/js/Highcharts-2.1.9/js/highcharts.js”></script>
     {% load chartit %}
     {{ pqpChart|load_charts:"container" }} 
    </head>
    <body>
     <div id=”container”>
     </div>
    </body>
    

    然后视图应该返回正确的变量,名称区分大小写。在您的示例中,使用您在 HTML 模板中使用的相同大小写:

    return render(request, {'pqpChart': cht})
    

    【讨论】:

    • 嗨,Alexander,我已根据您的建议进行了更改。但是图表没有呈现,我在浏览器中得到了这个:“{% load chartit %} {{ pqpChart|load_charts:"container" }}”请说明一下。
    • 请有更多建议!
    • 我现在在浏览器中得到-->,很奇怪!
    猜你喜欢
    • 2018-07-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2023-03-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-10-09
    相关资源
    最近更新 更多