因为需要，所以HIGHCHARTS了解一下是很有必要的。

但原始应用确实效率不行。

刚好，现在有个需求是从一系列的JSON里抽出表格数据，再显示图形。

jquery.highchartsTable.js怕个是极好的了。。基本文档URL：http://www.hcharts.cn/p/highchartTable.php

代码，

#!/usr/bin/python
#coding:utf-8

import datetime
import json
import sys

str_today = datetime.datetime.now().strftime('-%Y-%m-%d')
func_dict = {":("查","恒"),
            }
html_header = '''
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <!--<meta http-equiv="refresh" content="60">-->
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>HighCharts</title>
    <script src="js/jquery-1.9.1.min.js"></script>
    <script src="js/highcharts.js"></script>
    <script src="js/exporting.js"></script>
    <script src="js/jquery.highchartsTable.js"></script>
    <!--<script src="js/themes/dark-unica.js" type="text/javascript"></script> -->
    <script>
        $(document).ready(function() {
  $("table.highchart").highchartTable();
    });

  </script>
    <style type="text/css">
        .table
        {
        width: 100%;
        padding: 0;
        margin: 0;
        }
        th {
        font: bold 12px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
        color: #4f6b72;
        border-right: 1px solid #C1DAD7;
        border-bottom: 1px solid #C1DAD7;
        border-top: 1px solid #C1DAD7;
        letter-spacing: 2px;
        text-transform: uppercase;
        text-align: left;
        padding: 6px 6px 6px 12px;
        background: #CAE8EA no-repeat;
        }
        td {
        border-right: 1px solid #C1DAD7;
        border-bottom: 1px solid #C1DAD7;
        background: #fff;
        font-size:14px;
        padding: 6px 6px 6px 12px;
        color: #4f6b72;
        }
        </style>
</head>
<body>
<header>
<div align = "center">趋势数据展示页面</div>
<p></p>
</header>
'''
html_footer = '''
<footer>
<p></p>
<div align = "center">X@2015</div>
<p></p>
</footer>
</body>
</html>
'''

'''
with open('measurements.json', 'w') as f:
        f.write(json.dumps(str_json,ensure_ascii=False,indent=2))
'''

# 将字典排序
def sort_dict(dict_item):
    sort_dict_item = sorted(dict_item.iteritems(),key=lambda t:t[0],reverse=False)
    return sort_dict_item

def gen_content():
    json_file = "json/data" + str_today + ".json"
    with open(json_file) as f:
        data = f.read()
    # print data
    json_data = json.loads(data)
    dict_len = len(json_data)
    sort_json_data = sort_dict(json_data)
    return sort_json_data

def zip_pkg():
    pass

def send_mail():
    pass

def gen_html():

    html_filename = "index" + str_today + ".html"
    html_content = ''
    content_dict = gen_content()
    # 带循环次数，方便定位container
    for i, item_number in enumerate(content_dict):
        html_content += '''<div class="container{c_number}" style="width: 80%; height:400px;margin:0 auto;"></div>
                            <div align="center" ><table class="highchart" data-graph-container=".container{c_number}"
                            data-graph-subtitle-text="Data from Zabbix"
                            data-graph-type="line"  style="width: 80%">
                            <caption>{title}<caption>
                            <thead><tr>'''.format(c_number = i+1, title=item_number[1][0]['title'].encode('utf-8'))
        # 定位各个数据结构
        for i, item_head in  enumerate(item_number[1][1]['head']):
            if i == 0:
                html_content += '''<th >{item_head}</th>'''.format(item_head=item_head.encode('utf-8'))
            else:
                # 此处预留显示系统功能字段
                # html_content += '''<th>{item_func}<br>{item_code}|{item_sys}</th>'''.format(
                #    item_func=func_dict[item_head][0],item_code=item_head,item_sys=func_dict[item_head][1])
                html_content += '''<th>{item_func}{item_code}</th>'''.format(
                    item_func=func_dict[item_head][0], item_code=item_head)
        html_content += '</tr></thead><tbody>'
        for item_content in item_number[1][2]['content']:
            html_content += '<tr>'
            for item_end in item_content:
                if isinstance(item_end,(int,float)):
                    html_content += '''<td>{item_end}</td>'''.format(item_end=item_end)
                else:
                    html_content += '''<td>{item_end}</td>'''.format(item_end=item_end.encode('utf-8'))
                    pass
            html_content += '</tr>'
        html_content += "</tbody></table><hr></div>"

    # print html_content
    html_total = html_header + html_content + html_footer
    with open(html_filename, 'w') as f:
        f.write(html_total)

def main():
    gen_html()
    zip_pkg()
    send_mail()

if __name__ == '__main__':
    main()
    print 'finished!'

HTML生成的东东：

介绍一个超好用的HICHARTS扩展插件的更多相关文章

  1. 分享一个灰常好的 dapper 扩展插件: Rainbow

    dapper 是一个效率非常高的orm  框架 ,效率要远远大于 我们大微软的EF .    它只有一个类文件,非常之小.(在 EF 5.0 后 微软已经做了 改进) ps; 由于之前我也没测试过,只 ...

  2. 一个超详细vue无限滚动vue-infinite-scroll插件的配置及使用详解

    开发中总会遇到这种下拉加载的设计方案,Vue实现下拉加载最佳方案自然是使用vue-infinite-scroll来实现.接下来我们一起看下它的配置及使用方式. 首先我们先了解下他的配置参数: v-in ...

  3. 【新手向】一个超简单的jquery.mCustomScrollbar滚动条插件Demo

    <script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script> < ...

  4. 介绍一个基于jQuery的Cookie操作插件

    在网页客户端,我们经常会遇到读取或者设置cookie的情况,如果用纯生的js我们可能会遇到一些兼容性带来的麻烦,这里给大家介绍一个比较实用jquery操作cookie的插件,插件的源代码如下: jQu ...

  5. 介绍一个非常好用的跨平台C++开源框架:openFrameworks

    介绍一个非常好用的跨平台C++开源框架:openFrameworks 简介 首先需要说明的一点是: openFrameworks 设计的初衷不是为计算机专业人士准备的, 而是为艺术专业人士准备的, 就 ...

  6. vs2010(vs2012)好用的扩展插件介绍

    一直以来只使用番茄vs助手(https://www.wholetomato.com/downloads/default.asp)辅助写代码,也都忘了是谁介绍的,不过确实好用. 相比原始的vs,它提供了 ...

  7. 转：介绍一个好用的抓取dump的工具-ProcDump

    介绍一个好用的抓取dump的工具-ProcDump Procdump是一个轻量级的Sysinternal团队开发的命令行工具, 它的主要目的是监控应用程序的CPU异常动向, 并在此异常时生成crash ...

  8. 介绍一个简单的Parser

    我们已经学习了怎样创建一个简单的Monad, MaybeMonad, 并且知道了它如何通过在 Bind函数里封装处理空值的逻辑来移除样板式代码. 正如之前所说的,我们可以在Bind函数中封装更复杂的逻 ...

  9. 硬盘的结构和介绍，硬盘MBR详细介绍（超详细彩图）

    一.物理结构 1.磁道,扇区,柱面和磁头数 硬盘最基本的组成部分是由坚硬金属材料制成的涂以磁性介质的盘片,不同容量硬盘的盘片数不等.每个盘片有两面,都可记录信息.盘片被分成许多扇形的区域,每个区域叫一 ...

随机推荐

  1. Yii2查询语句使用不等于号

    Yii2 Active Record查询条件使用不等于号,需要使用到 operator format: [operator, operand1, operand2, ...] 运算符格式: [运算符, ...

  2. SharePoint移动客户端对比 ---Rshare 无疑是最好用的

    目前市面上SharePoint移动客户端确实不少,但经过使用后的对比,Rshare无论在界面上还是在操作性上都占据了优势.大家可以下载进行尝试.

  3. Android——按钮的事件监听

    关于Button按钮的四种事件监听方法总结 首先我们在activity_main.xml里面先定义一个Button空间 <RelativeLayout xmlns:android="h ...

  4. 整理：sql语句优化之SQL Server

    . 增加服务器CPU个数;但是必须明白并行处理串行处理更需要资源例如内存.使用并行还是串行程是MsSQL自动评估选择的.单个任务分解成多个任务,就可 以在处理器上运行.例如耽搁查询的排序.连接.扫描和 ...

  5. [记录 ]升级IOS 9 和 XCode 7 引起的问题

    问题一: 升级xcode 7最低的系统配置要求 升级了ios9 后使用 xcode 6.1 已经不能用了,必须升级 xcode 7才行,原先的系统是OSX 10.10.1 版本.而xcode 7.0 ...

  6. 无限大整数相加算法的C语言源代码

    忙里偷闲,终于完成了无限大整数相加算法的C语言代码,无限大整数相加算法的算法分析在这里. 500位的加法运行1000次,不打印结果的情况下耗时0.036秒,打印结果的情况下耗时16.285秒. 下面是 ...

  7. js个人笔记

    一.删除元素 <!DOCTYPE html> <html> <head> <title>删除元素</title> </head> ...

  8. [转]js中几种实用的跨域方法原理详解

    转自:js中几种实用的跨域方法原理详解 - 无双 - 博客园 // // 这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同 ...

  9. java新手笔记25 日期格式化

    1.系统时间 package com.yfs.javase; import java.sql.Time; import java.sql.Timestamp; import java.util.Cal ...

  10. [算法] get_lucky_price price

    int get_lucky_price(int price, const vector & number) 题意大概是给你一个数price,比如1000,然后有unlucky_num,有{1, ...