Python Django chartit 多报表显示
Python Django chartit 多报表显示
静夜听风 发表于2年前
Python Django chartit 多报表显示
  • 发表于 2年前
  • 阅读 1286
  • 收藏 0
  • 点赞 0
  • 评论 0

移动开发云端新模式探索实践 >>>   

摘要: Python Django chartit 多报表显示

Django 安装chartit 插件后,默认一个页面只能显示一个报表,如果想显示多个报表,需要修改下chartit模块

路径:\site-packages\chartit\templatetags\chartit.py

分析网页代码,主要是js在控制,而且调用的js名字不会改变,找到如下几行

embed_script = (
  '<script type="text/javascript">\n'
  'var _chartit_hco_array = %s;\n</script>\n'
  '<script src="%s" type="text/javascript">\n</script>')
  
embed_script = (embed_script % (simplejson.dumps(chart_list,
                                                 use_decimal=True),
                                CHART_LOADER_URL))

修改如下, 让每个报表使用自己单独的js,并删除最后一条,修改地方如下

embed_script = (
  '<script type="text/javascript">\n'
  'var _chartit_hco_array_%s = %s;\n</script>\n')
embed_script = (embed_script % (render_to,simplejson.dumps(chart_list,
                                                 use_decimal=True)
                                ))

在模板里面调用chartit, 并指定render_to, 还需要添加新的js

<script src="/static/js/show.js" type="text/javascript"></script>
{% load chartit  %}
{{ uv|load_charts:"uvdata" }}
{{ pv|load_charts:"pvdata" }}
<div id='uvdata'> Chart will be rendered here </div>
<div id='pvdata'> Chart will be rendered here </div>

show.js 内容

$(document).ready(function() {
   $.each(_chartit_hco_array_uvdata, function(index, chartoptions) {
      chart = new Highcharts.Chart(chartoptions);
   });
   $.each(_chartit_hco_array_pvdata, function(index, chartoptions) {
      chart = new Highcharts.Chart(chartoptions);
   });
});

最终实现效果


  • 打赏
  • 点赞
  • 收藏
  • 分享
共有 人打赏支持
粉丝 12
博文 24
码字总数 13019
×
静夜听风
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: