文章/答案/技术大牛

发布

社区首页 >问答首页 >如何使用flask框架在html页面中动态显示python图表

问如何使用flask框架在html页面中动态显示python图表
EN

Stack Overflow用户

提问于 2019-10-10 14:13:40

回答 1查看 1.8K关注 0票数 0

pie chart: i expect dynamic visualise , please click and check my charts and how to visualise dynamically . 我用python动态创建了图表，我必须直接插入到HTML页面中并动态查看图表，但我无法插入到我的HTML页面中。

我可以在HTML页面中将图表显示为图像，而我无法在动态中可视化。

我想知道HTML中关于要从python代码直接插入到我的HTML页面中的绘图和图形的代码，或者任何其他在用户界面中动态可视化绘图和图形的方式。

                    <h6 class="m-1" >Purchase Stats</h6>
                <div>
                                            <img src="{{ pie }}" width="380" height="333"> 
                        
                    </div>

    data=pd.read_csv("sales_data.csv")
    df = pd.DataFrame(data)
    filtered_data=data[['quantity','states_x']]
    filtered_data1=data[['product category']]

    #finding the sales by region
    sales_by_region = df.groupby('states_x').size()
    sales_by_region.head()
    filtered_data.states_x.value_counts()[:14].plot(kind='bar')
    plt.title('Top 15 Statewise Sales')
    plt.xlabel('Region')
    plt.ylabel('Total Sales')

    plt.tight_layout()
    plt.savefig('static/images/bar.png')

### Rendering Plot in Html
##figfile = BytesIO()
#plt.savefig(figfile, format='png')
    bar = os.path.join(app.config['UPLOAD_FOLDER'], 'regionwise_sales.png')
    
    return render_template('index.html',pie = pie  )

python

html

flask

回答 1

Stack Overflow用户

发布于 2019-10-10 14:33:36

这是我的python代码

import pygal
from flask import Flask,render_template,request,session
from flask.templating import render_template
from pygal.style import Style
import pandas 


@app.route('/bar_route')   
def bar_route():
    try:

        bar_chart = pygal.Bar()
        bar_chart.title = 'Browser usage evolution (in %)'
        bar_chart.x_labels = map(str, range(2002, 2013))
        bar_chart.add('Firefox', [None, None, 0, 16.6,   25,   31, 36.4, 45.5, 46.3, 42.8, 37.1])
        bar_chart.add('Chrome',  [None, None, None, None, None, None,    0,  3.9, 10.8, 23.8, 35.3])
        bar_chart.add('IE',      [85.8, 84.6, 84.7, 74.5,   66, 58.6, 54.7, 44.8, 36.2, 26.6, 20.1])
        bar_chart.add('Others',  [14.2, 15.4, 15.3,  8.9,    9, 10.4,  8.9,  5.8,  6.7,  6.8,  7.5])
        barchart_data=bar_chart.render_data_uri()
        return render_template('barchart.html',barchart_data=barchart_data)




    except Exception:
        return "error"

barchart.html代码如下所示：

 {% block content %}
    <!-- Don't forget the "|safe"! -->
    <div id="chart">
       <embed type="image/svg+xml" src= {{ barchart_data|safe }} style="width:50%;height:50%" />
          </div>    
  {% endblock %}

那么你的网页将会是

试一试这个

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/58316502

复制

相似问题

问如何使用flask框架在html页面中动态显示python图表
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用flask框架在html页面中动态显示python图表EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用flask框架在html页面中动态显示python图表
EN