SQLクエリで取得した値を他の関数で使用したいです

Question

前提・実現したいこと

djangoでSQLクエリから取得した値を使用して、グラフを表示したいです。
しかし、取得したい変数は関数を使用して値を取得したため、ローカル変数であり、現在解決方法がわかりません。（コード上のdeficiency_taroの部分です）
他の質問に記載されていた、'global 変数' のようにしてもコードを実行できなかったため今回質問させていただきます。
初歩的な質問かと思いますがどうぞよろしくおねがいします。

発生している問題・エラーメッセージ

グラフの画像が表示されません。

試したこと

以下のコードを実行しました。

該当のソースコード

views.py

import io
import matplotlib
matplotlib.use('Agg')
import matplotlib.pyplot as plt
import base64

class MoneyListView(ListView):
    model = Money
    context_object_name = 'money_list'
    paginate_by = 3

    #db aggregate
    def get_context_data(self, **kwargs):
        context = super().get_context_data(**kwargs)

        #average
        avg_amount = Money.objects.aggregate(Sum('amount'))['amount__sum']/3
        context["avg_amount"] = avg_amount

        #payment/per name=Taro
        pay_taro = Money.objects.filter(name='Taro').aggregate(Sum('amount'))['amount__sum']
        context["pay_taro"] = pay_taro

        #deficiency/per name=Taro
        deficiency_taro = avg_amount - pay_taro
        context["deficiency_taro"] = deficiency_taro

    #graph
    def create_graph(x_list, y_list):
        plt.cla()
        plt.plot(x_list, y_list)
        plt.xlabel('名前')
        plt.ylabel('過不足')

    #convertion
    def get_image():
        buffer = ioByteIO()
        plt.saveconfig(buffer, format='png')
        image_png = buffer.getvalue()
        graph = base64.b64encode(image_png)
        graph = graph.decode('utf-8')
        buffer.close()
        return graph

    #send html
    def home(request):
        x_list = ['Taro']
        y_list = [deficiency_taro]
        create_graph(x_list, y_list)
        graph = get_image()
        return render(request, 'differential/home.html', {'graph': graph})

補足情報（FW/ツールのバージョンなど）

python 3.9.1
django 3.1.5

Comments

[plasticgrammer]

わからない箇所があるので確認させてください。
home関数にて使用している「utils」の実体はMoneyListViewクラスかと思いますが、どこで作成されているのでしょうか。

[taro__]

返信ありがとうございます。
「utils」というコードはhome関数でのみ書いています。
どこかで作成する必要があるのでしょうか。

知識不足で申し訳ありません。
よろしくおねがいします。

[plasticgrammer]

> 「utils」というコードはhome関数でのみ書いています。
> どこかで作成する必要があるのでしょうか。
そもそも、なぜ「utils.関数名」としているのでしょうか。
その理由がわからないのでなんとも言えませんが、なくても良いと思っています。

[taro__]

わかりました。

utilsを削除し以下のコードを実装しましたが、相変わらずグラフが表示されません。
解決策がわからないため、ご教授いただけないでしょうか。

views.py

#send html
def home(request):
x_list = ['Taro', 'Koki', 'Kaze']
y_list = [deficiency_taro, deficiency_koki, deficiency_kaze]
utils.create_graph(x_list, y_list)
graph = get_image()
return render(request, 'differential/home.html', {'graph': graph})

htmlファイル
<img src="data:image/png;base64, {{ graph | safe }} " alt="">

[plasticgrammer]

utils.create_graph
上記の「utils.」も削除しましたか？
修正後のソースは質問側を修正くださいますようお願いします。

修正後、何かエラーが発生しているのでしょうか。

[taro__]

すみません。忘れていました。
上記の「utils.」を削除後、再度 ./manage.py runserver を実行したところ、エラーは発生しませんでした。
しかし、画像は表示されませんでした。

view.py
#send html
def home(request):
x_list = ['Taro', 'Koki', 'Kaze']
y_list = [deficiency_taro, deficiency_koki, deficiency_kaze]
create_graph(x_list, y_list)
graph = get_image()

return render(request, 'differential/home.html', {'graph': graph})

htmlファイル
<img src="data:image/png;base64, {{ graph | safe }} " alt="">

[plasticgrammer]

修正後のソースは質問側を修正くださいますようお願いします。

状況が進んだようですので、一旦回答を記載します。

Answer 1

・ioByteIO　→ io.BytesIO
・plt.saveconfig　→　plt.savefig
・get_context_data()内で return contextしていないので、設定したデータがテンプレートに渡されていません。
・MoneyListView.home()でグラフデータのレンダリングをして、テンプレートに渡そうとしているようですが、 MoneyListViewのget_data_context()の中でデータベースから取得し計算したデータを、
どうやってグラフデータ作成に利用するか、というところについては、
グラフ画像のバイナリをBase64エンコードしてテンプレートに渡すというアプローチをとろうとされているようなので、グラフデータ作成処理部分は汎用ビューから切り離し、エンコード結果を、（データベースから取得し計算したデータと一緒に）contextとして渡した方がすっきりするのではないかと思いました。

以上をまとめたコードが以下です。データの設定等は愚直なままですが元のコード自体がそうなのであしからず。

views.py

# views.py

import io
import matplotlib
import matplotlib.pyplot as plt
import base64
from django.views.generic import ListView
from django.db.models import Sum
from .models import Money
matplotlib.use('Agg')


class MoneyListView(ListView):
    model = Money
    context_object_name = 'money_list'
    template_name = 'moneyapp/money_list.html'
    
    # db aggregate
    def get_context_data(self, **kwargs):
        context = super().get_context_data(**kwargs)
        avg_amount = Money.objects.aggregate(Sum('amount'))['amount__sum'] / 3
        context["avg_amount"] = avg_amount

        # payment/per name=Taro
        pay_taro = Money.objects.filter(name='Taro').aggregate(Sum('amount'))['amount__sum']
        pay_jiro = Money.objects.filter(name='Jiro').aggregate(Sum('amount'))['amount__sum']
        pay_koki = Money.objects.filter(name='Koki').aggregate(Sum('amount'))['amount__sum']
        pay_kaze = Money.objects.filter(name='Kaze').aggregate(Sum('amount'))['amount__sum']
        context["pay_taro"] = pay_taro
        context["pay_jiro"] = pay_jiro
        context["pay_koki"] = pay_koki
        context["pay_kaze"] = pay_kaze

        # deficiency/per name=Taro
        deficiency_taro = avg_amount - pay_taro
        deficiency_jiro = avg_amount - pay_jiro
        deficiency_koki = avg_amount - pay_koki
        deficiency_kaze = avg_amount - pay_kaze
        context["deficiency_taro"] = deficiency_taro
        context["deficiency_jiro"] = deficiency_jiro
        context["deficiency_koki"] = deficiency_koki
        context["deficiency_kaze"] = deficiency_kaze

        x_list = ['Taro', 'Jiro', 'Koki', 'Kaze']
        y_list = [deficiency_taro, deficiency_jiro, deficiency_koki, deficiency_kaze]
        create_graph(x_list, y_list)
        graph = get_image()

        # グラフデータもcontextに。
        context["graph"] = graph
 
        # contextを返す。
        return context

# グラフデータ作成処理部分
def create_graph(x_list, y_list):
    plt.cla()
    plt.bar(x_list, y_list)
    plt.xlabel('name')
    plt.ylabel('deficiency')


def get_image():
    buffer = io.BytesIO()
    plt.savefig(buffer, format='png')
    image_png = buffer.getvalue()
    graph = base64.b64encode(image_png)
    graph = graph.decode('utf-8')
    buffer.close()
    return graph

urls.py

# urls.py

from django.urls import path
from . import views
app_name = 'plot'
urlpatterns = [
    path('index/', views.MoneyListView.as_view(), name='index'),
]

　

money_list.html

{% extends 'base.html' %}
{% block content %}
<h1>Graph</h1>

<img src="data:image/png;base64, {{ graph | safe }} " alt="">

<table>
    <tr>
        <th></th>
        <th>Taro</th>
        <th>Jiro</th>
        <th>Koki</th>
        <th>Kaze</th>

    </tr>
    <tr>
        <td>payment</td>
        <td>{{ pay_taro |floatformat:0 }}</td>
        <td>{{ pay_jiro |floatformat:0 }}</td>
        <td>{{ pay_koki |floatformat:0 }}</td>
        <td>{{ pay_kaze |floatformat:0 }}</td>
    </tr>
    <tr>
        <td>deficiency</td>
        <td>{{ deficiency_taro |floatformat:0 }}</td>
        <td>{{ deficiency_jiro |floatformat:0 }}</td>
        <td>{{ deficiency_koki |floatformat:0 }}</td>
        <td>{{ deficiency_kaze |floatformat:0 }}</td>
    </tr>
    
</table>
{% endblock %}

ディレクトリ構成

myapp/
├ money_app/
| ├ migrations/
| ├ templates/
| |  ├ money_app/
| |  |  └ money_list.html
| |  └ base.html
| ├ admin.py
| ├ apps.py
| ├ models.py
| ├ urls.py
| └ views.py
├ myapp/
├ 　└･･･
├　･･･
├ manage.py
└ db.sqlite3

Comments

[taro__]

返信ありがとうございます！
表示できました！

[taro__]

データの設定等は愚直なままだとは思いますが、よりよい方法があればご教授いただけないでしょうか。

models.py

from django.db import models

CHOICE = (('Taro', 'Taro'), ('Koki', 'Koki'), ('Kaze', 'Kaze'))

class Money(models.Model):
purpose = models.CharField('用途', max_length=100)
name = models.CharField(
'名前',
max_length=100,
choices=CHOICE
)
amount = models.IntegerField('金額(円)')
posted_date = models.DateTimeField('時刻', auto_now_add=True)

class Meta:
ordering = ['-posted_date']

def __str__(self):
return self.purpose

[退会済みユーザー]

コメント欄だとインデントがわからなくなるので、別の質問を立ててもらってもいいでしょうか。

あと、その時もなるべくプロジェクトの全部のソース及びディレクトリ構成を載せていただけると、プログラムの改善や理解の上で助かります。

すくなくとも、models.py,　templatesフォルダ内のキモとなるhtmlファイル、views.py、urls.pyは全部記載してください。ディレクトリ構成も可能な限り示してください。
import文も勝手に消さないでください。

なせなら、djangoは影響が複数のファイルに亘り、ディレクトリ内の位置やファイル名が変わっただけでも動かなくなるからです。

たとえば私は上記の回答するにあたって、
・質問文に記載されていないimport文をエラーが出なくなるまで補完したり、
・model（Money）をコードから推測して作ったり、
・urls.pyやtemplate下のファイルを自分で作ったり
・その他ダミー用のデータを作ったり、
・多分setting.pyのここはこうなってるんだろうな～
等、うまく動かすためにあらゆるところを何回も何回も試行錯誤しながら補完して回答したわけです。

もし全部のソースを載せていただいたなら、このような手間もないので。

[taro__]

知識不足で大変申し訳ございません。
https://teratail.com/questions/319425　に質問しましたので、解決策をご教授いただけないでしょうか。
ソースコードはgithubのurlを記載させていただきました。
念の為、こちらにも記載させていただきます。

[退会済みユーザー]

ご協力ありがとうございます。

Answer 2

home関数にて使用している「utils.」は不要かと思います。

エラーなく動くようであれば、ブラウザの開発者ツールを使用して、imgのsrc属性に期待通りの値が設定されているか確認してみてください。

Comments

[taro__]

<img src="data:image/png;base64, {{ graph | safe }} " alt="">と入力しましたが、
確認すると、<img src="data:image/png;base64," alt="">でした。