zoukankan      html  css  js  c++  java
  • 基于python3.6+pyecharts+flask实现数据可视化

    pyecharts这个库啊……这个库业障重,建议谨慎使用(不是

    裸连pyecharts的官网持续loading,于是直接pip装完,也不需要额外配置其他的内容

     官网教程看的不清不楚,所有例程都是用render渲染的,你一个网页只用一个图表的吗?不知道是什么样的需求会产生这种代码,而查到的大部分代码最终发现是对python2.7支持的,新版V1和旧版完全不兼容,经过一番折腾,总算搞定了最小系统,分享一下以便后人乘凉

    routes.py(flask的部分不细说,仅展示核心部分,使用set传参,保证简洁性,需要同时展现更多的图表,仅需对page映射的list进行append即可

    1 from pyecharts.charts import Line
    2 from pyecharts import options as opts
     1 c = (
     2     Line()
     3     .add_xaxis(["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"])
     4     .add_yaxis("商家A", [5, 20, 36, 10, 75, 90])
     5     .add_yaxis("商家B", [15, 25, 16, 55, 48, 8])
     6     .set_global_opts(title_opts=opts.TitleOpts(title="Bar-基本示例", subtitle="我是副标题"))
     7 )
     8 data.update({
     9     "page": [["c1", c.dump_options()], ["c2", c.dump_options()]]
    10 })
    11 return render_template('your.html', data=data)

    your.html(使用了bootstrap,上下分别为正文和js)

    1 {% for i in data.page %}
    2     <div id="{{ i[0] }}" style=" 1000px; height: 400px"></div>
    3 {% endfor %}
    1 <script src="{{ url_for('static', filename='vendors/echarts/dist/echarts.min.js') }}"></script>
    2 {% for i in data.page %}
    3     <script type="text/javascript">
    4         var myChart = echarts.init(document.getElementById("{{ i[0] }}"));
    5         myChart.setOption({{ i[1] | safe }});
    6     </script>
    7 {% endfor %}

    js中for循环必须在引入echarts.js之后,否则会报错找不到对象(不过放在后面也找不到对象

    感谢:(这位dalao吐槽的非常犀利)

    Flask使用Pyecharts在单个页面展示多个图表
    http://www.crazyant.net/2419.html?utm_source=tuicool&utm_medium=referral
  • 相关阅读:
    React元素渲染
    初识JSX
    微信小程序复制文本到剪切板
    微信小程序报错request:fail url not in domain list
    小程序,通过自定义编译条件,模拟推荐人功能
    积分抵扣逻辑
    微信小程序 switch 样式
    tomcat 配置开启 APR 模式
    tomcat8 传输json 报错 Invalid character found in the request target. The valid characters are defined in RFC 3986
    c++数组初始化误区
  • 原文地址:https://www.cnblogs.com/Pyrokine/p/13061725.html
Copyright © 2011-2022 走看看