因为需要，所以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 = {"103":("查","恒"),
}
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">[email protected]</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生成的东东：
时间： 2024-11-03 23:01:30