【43日目】Plotly【Djangoで表示成功】

今日の写真のテーマは「成功」です。
やっとPlotlyで思っていた設定で、グラフを表示することが出来るようになりました。

１．Views.py

雑に修正をしているので、不要なコードも結構あると思いますが、現時点でview.pyは以下のような形になっています。

from django.http import HttpResponse
from django.shortcuts import render
from django.views.generic import TemplateView
from .forms import ChartForm
from .models import Rate
import pandas as pd
import numpy as np
from plotly.tools import FigureFactory as FF
from plotly.offline import plot

def convert2df(data,choice_timeframe):
   timestamp = []
   open_rate = []
   high_rate = []
   low_rate = []
   close_rate = []
   for i in data:
       timestamp.append(i["timestamp"])
       open_rate.append(i["open_rate"])
       high_rate.append(i["high_rate"])
       low_rate.append(i["low_rate"])
       close_rate.append(i["close_rate"])
   data_jisyo = {'open_rate':open_rate,"high_rate":high_rate,"low_rate":low_rate,"close_rate":close_rate}
   agg_jisyo = {'open_rate': 'first','high_rate': 'max','low_rate': 'min','close_rate': 'last'}
   df = pd.DataFrame(data_jisyo,index = timestamp).resample(choice_timeframe).agg(agg_jisyo) 
   return df

class ChartView(TemplateView):
   def __init__(self):
       self.params = {
           'msg':"条件を入力してください",
           'form':ChartForm(),
           'plot_chart':"",
           }

   def get(self,request):
       return render(request,'chart/index.html', self.params)

   def post(self,request):
       choice_symbol = request.POST["choice_symbol"]
       choice_timeframe = request.POST["choice_timeframe"] 
       data = Rate.objects.all().values("timestamp","open_rate", "high_rate", "low_rate", "close_rate")[:100]
       df = convert2df(data,choice_timeframe)
       fig = FF.create_candlestick(df["open_rate"], df["high_rate"], df["low_rate"], df["close_rate"], dates=df.index)
       plot_chart = plot(fig, output_type='div', include_plotlyjs=False)
       self.params['msg']="条件："+ choice_symbol + " , "+ choice_timeframe
       self.params['form'] = ChartForm(request.POST)
       self.params['plot_chart'] = plot_chart
       return render(request,'chart/index.html', self.params)

２．base.html

間違っていたのは、base.htmlの方でした。
何も考えずに末尾に以下の一文を記載してましたが、チャートを表示するあたりに場所を移し替えたところ、falseのままでもチャートを表示できるようになりました。

 <!-- Content Wrapper. Contains page content -->
 <div class="content-wrapper">
 <!-- Plotly -->
 <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
   <!-- Main content -->
   <section class="content">
     <div class="container-fluid">
       <!-- Main row -->
           {% block content %}
           {% endblock %}
       <!-- /.row (main row) -->
     </div><!-- /.container-fluid -->
   </section>
   <!-- /.content -->
 </div>

３．実際の画面

開発サーバー（？）に接続すると以下のように表示されます。
すっげぇぇ！こういうの見たことある。
感動です。