在Django 3.1应用中无法正确显示垂直堆叠的Plotly子图中第二个图中的数据

如何解决在Django 3.1应用中无法正确显示垂直堆叠的Plotly子图中第二个图中的数据

我正在使用dpally运行Django 3.1应用程序，以在.html模板文件中显示交互式图表。

我正在尝试使用subplots功能创建图。

该图有2行和1列。第一行正确显示了第一张图表，它是每日股票价格的阴阳烛图。该图的第二行是条形图，显示了股票价格每一天的交易量。

运行该应用程序时，没有收到服务器错误，并且.html页面按预期加载。

但是，第二个图应为体积的条形图，但该图为空白。该图正确显示了yaxis和xaxis标题以及刻度值，如对Volume数据所期望的那样。

如果将axis_rangeslider_visible设置为True，则该图表将在第二个图表中显示应该选择体积数据的范围选择器。轴标签仍然显示期望值和标签，就像绘制体积数据一样。

以下代码来自Django应用中的views.py文件。

from django.shortcuts import render
from django.contrib.auth.mixins import LoginRequiredMixin,UserPassesTestMixin
from django.views.generic import ListView,DetailView,CreateView,UpdateView,DeleteView
from users.models import CustomUser
from .models import Chart

import pandas as pd
from datetime import datetime
from smart_open import smart_open
from django.conf import settings
import plotly.express as px
import plotly.graph_objs as go
from plotly.subplots import make_subplots


class ChartDetailView(LoginRequiredMixin,DetailView):
    model = Chart
    
    def get_queryset(self):
        return Chart.objects.filter(user=self.request.user)

    def get_context_data(self,**kwargs):
        context = super().get_context_data(**kwargs)
        
        path = 's3://{}:{}@{}/{}'.format(settings.AWS_ACCESS_KEY_ID,settings.AWS_SECRET_ACCESS_KEY,settings.AWS_STORAGE_BUCKET_NAME,self.object.data_file.name)

        df_daily = pd.read_csv(smart_open(path),parse_dates=True)
        df_daily['Date'] = pd.to_datetime(df_daily['Date'])
        df_daily = df_daily.set_index('Date')

        fig_daily = make_subplots(rows=2,cols=1,row_heights=[0.8,0.2],specs=[[{"type": "candlestick"}],[{"type": "bar"}]],shared_xaxes=True,vertical_spacing=0.02)

        fig_daily.add_trace(go.Candlestick(x=df_daily.index,open=df_daily['Open'],high=df_daily['High'],low=df_daily['Low'],close=df_daily['Close'],showlegend=False,),row=1,col=1)

        fig_daily.add_trace(go.Bar(x=df_daily.index,y=df_daily['Volume'],marker=dict(color="crimson"),showlegend=False),row=2,col=1)

        # Update xaxis properties
        fig_daily.update_xaxes(title=None,col=1)
        fig_daily.update_xaxes(title="Date",col=1)

        # Update yaxis properties
        fig_daily.update_yaxes(title="$/share",col=1)
        fig_daily.update_yaxes(title="Volume",range=[0,df_daily['Volume'].max()],col=1)

        fig_daily.update_layout(title='Daily Stock Price and Volume',xaxis_rangeslider_visible=False,margin=dict(r=5,t=30,b=5,l=5),height=650,width=700)

        graph_daily = fig_daily.to_html()

        df_daily = df_daily[['Open','High','Low','Close','Volume']].to_html(classes='mystyle')

        context['df_daily'] = df_daily
        context['graph_daily'] = graph_daily

        return context

解决方法

嗯，我仍然不了解潜在的问题是什么。但是，我通过绘制较小的样本量解决了我的迫切需求。原始图具有约5500个数据点。当我将尺寸限制为小于500时，第二个子图正确显示。

因此在绘图子图中可以使用多少个数据点有上限。并且仅在第二个情节中。令人困惑。