2

フロントエンドでグラフを描画して表示する必要があるdjangoフレームワークを使用してWebアプリに取り組んでいます。だから私はこの目的のためにdjangochartitを使用していますが、django開発サーバーを実行すると、空白のブラウザー画面が表示されず、エラーも表示されません。私は間違ったことを失ってしまいました。

これがグラフをレンダリングするビューです

from chartit import DataPool,Chart
from django.template import RequestContext
from django.template import Context,loader
from django.shortcuts import render_to_response
from django.http import HttpResponse
from graphtest.apps.graph_app.models import charttest
def chartview(request):
    powerdata = DataPool(series=[{'options':{
        'source':charttest.objects.all()},
        'terms':[
            'power',
            'time']}])
    cht = Chart(datasource=powerdata,series_options=[{'options':
                                                          {'type':'line',
                                                           'stacking':False},
                                                          'terms':
                                                              {'time':['power',]}}],
        chart_options={
        'title':{
            'text':'power data'},
        'xAxis':{'title':{'text':'xaxis'}}})

    return render_to_response('graph.html',{'powerchart': cht})

グラフが作成されるモデル

from django.db import models

class charttest(models.Model):
    power = models.PositiveIntegerField()
    time = models.DecimalField(decimal_places=10,max_digits=20)
    def __unicode__(self):
        return unicode(self.power)+' '+unicode(self.time)

とテンプレート

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="/static/js/highcharts.js"></script>
    <script src ="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    <script type ="text/javascript" src ="http://code.jquery.com/jquery-1.7.1.min.js"></script>
    {% load chartit %}
    {{ powerchart|load_charts:"container"}}

</head>
<body>
<div id="container"></div>
</body>
</html>

私が何時間も立ち往生しているのを手伝ってください。さらに情報が必要な場合はお問い合わせください。

4

4 に答える 4

2

次のことを試してください。

<div id="container">{{ powerchart|load_charts:"container"}}</div>
于 2013-04-11T18:20:17.453 に答える
1

これで問題が解決しました。

{% extends "base.html" %}

{% load chartit %}
{% block title %}Gráfico gratuito{% endblock %}

{% block content %}
    {% block javascript %}
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
        <script src="http://code.highcharts.com/highcharts.js"></script>
    {% endblock %}
    <div class="container">
        <div class="row">
            <div id="gratis">{{ data|load_charts:"gratis" }}</div>
        </div>
    </div>
{% endblock %}

于 2016-08-25T01:54:10.563 に答える
0

1. highcharts.jsファイルを静的ファイルに配置し、パスが正しいことを確認します。

2.次のようなコードを注文してみてください。

于 2014-10-27T09:06:44.243 に答える
0

Jquery.jsがhighcharts.jsの前にあることを確認してください

<script src ="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type ="text/javascript" src ="http://code.jquery.com/jquery-1.7.1.min.js">


<script type="text/javascript" src="/static/js/highcharts.js"></script>
于 2014-12-10T08:11:41.237 に答える