flask蓝图+pyecharts+mysql图表显示问题

问题遇到的现象和发生背景

最近因为项目的关系，需要使用flask+pyecharts+MySQL,让数据从数据库中读取后渲染到前端页面，显示图表，官方给出的方法是直接在flask的app上操作并显示图表，但因为使用了蓝图，按照官方给出的方法就无法将数据渲染到图表上了，那么请问我改如何解决这个问题呢？
请见截图（给出是一个测试）：
后端代码截图：

前端页面代码（使用了flask模板）：

效果：

可以看到是一片白色，那么要让数据返回并且是从蓝图上返回，那么该在后端如何改?到底返回的是什么？感谢感谢！

按照你现在的逻辑似乎是并没有把后端的数据传递到前端，只传递了了一个html模板，你应该是把那个c返回到前端吧

后端给前端页面返回一个json数组，json数据写入echarts图表

不要返回html页面，直接返回数据，下面是已在页面中实现：

后端代码：

def echarts_pie(types: list, data: list, title: str) -> Pie:
    c = Pie()
    c.add("", [list(z) for z in zip(types, data)], radius=["40%", "75%"], )
    c.set_global_opts(title_opts=opts.TitleOpts(title=title), legend_opts=opts.LegendOpts(orient="vertical", pos_left="10%", pos_top="20%"))
    c.set_series_opts(label_opts=opts.LabelOpts(formatter="{b}: {c}"))
    return c

@index_bp.post('/barChart')
@login_required
def bar_chart():
    n_type = ['二阶文件', '三阶文件', '四阶文件', '临时文件', '外来文件', '审批文件', '临技']
    level2_count = Level2.query.count()
    level3_count = Level3.query.count()
    level4_count = Level4.query.count()
    temp_count = Temp.query.count()
    foreign_count = Foreign.query.count()
    lj_count = Lj.query.count()
    approve_count = ApproveFile.query.count()
    data_list = [level2_count, level3_count, level4_count, temp_count, foreign_count, approve_count, lj_count]
    title = '2.各类文件总数统计'
    c = echarts_pie(n_type, data_list, title)
    return c.dump_options_with_quotes()

前端代码:

```javascript
<div class="layuimini-container">
    <div class="layui-fluid">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md6" style="padding:10px">
                <div class="layui-card">
                  <!-- <div class="layui-card-header">图表1</div> -->
                  <div class="layui-card-body">
                    <div class="layui-carousel layadmin-carousel layadmin-dataview" data-anim="fade" lay-filter="LAY-index-normline">
                        <div id="echarts-pie1" style="background-color:#ffffff;min-height:500px;padding: 5px"></div>
                    </div>
                  </div>
                </div>
            </div>
          
        </div>
    </div>

</div>
<script src="../static/lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="https://assets.pyecharts.org/assets/echarts.min.js"></script>

<script>
    layui.use(['form', 'table'], function () {
        var $ = layui.jquery;
        
        var chart1 = echarts.init(document.getElementById('echarts-pie1'), 'gray', {renderer: 'canvas'});
        
        $(function(){   //js 加载时，AJAX请求
              $.ajax({
                url:'/barChart',
                type:'post',
                dataType:'json',
                success:function(result){
                    // console.log(result);
                    chart1.setOption(result);
                },
                error:function(){
                    layer.msg('API出错!');
                }
            })
        });
        
</script>

```

就返回了一个html，还是没渲染有数据的，前端Ajax请求不会自动帮你渲染页面的