标签:style http ar io color os 使用 sp for
前段时间使用了pandas+matplotlib画图,后来想想,因为是使用图片展现的,而不是动态展现,确实不怎么好。
这样我们来改进下使用higchart(我试过Django chartit,我认为这东西把简单的东西复杂话了,真心的,直接使用highchart更方便)
数据
d={‘1.htldxhzj.duapp.com‘: 9398, ‘gtxapi.cdn.duapp.com‘: 79496, ‘www.xxx.com‘: 2477070, ‘www.baidu.com‘: 1465, ‘www.bing.com‘: 777, ‘www.aaa.com‘: 1113101, ‘www.ccc.net.cn‘: 922, ‘www.zhanimei.ga‘: 29847, ‘www.zhanimei.ml‘: 40155, ‘www.zhasini.ml‘: 373436}
highchart
我们先画一个简单的柱状图,和前面一样。 下面这个是代码,这个代码到官网的去复制就行了,很多实列。
<script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script> <script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script> <script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/exporting.js"></script> <script> $(function () { $(‘#container‘).highcharts({ chart: { type: ‘column‘, margin: [ 50, 50, 100, 80] }, title: { text: ‘网站访问数据‘ }, xAxis: { categories: {{ categories | safe }}, \\这里我们引入的数据 labels: { rotation: 0, align: ‘right‘, style: { fontSize: ‘13px‘, fontFamily: ‘Verdana, sans-serif‘ } } }, yAxis: { min: 0, title: { text: ‘访问量‘ } }, legend: { enabled: false }, tooltip: { pointFormat: ‘访问量: <b>{point.y:.1f}</b>‘, }, series: [{ name: ‘今天的日志‘, data: {{ data }}, dataLabels: { enabled: false, rotation: -90, color: ‘#FFFFFF‘, align: ‘right‘, x: 4, y: 10, style: { fontSize: ‘13px‘, fontFamily: ‘Verdana, sans-serif‘, textShadow: ‘0 0 3px black‘ } } }] }); }); </script> <div id="container" style="min-width:700px;height:400px"></div> //出图就在这里了
看看数据是如何的
>>> d={‘1.htldxhzj.duapp.com‘: 9398, ‘gtxapi.cdn.duapp.com‘: 79496, ‘www.xxx.com‘: 2477070, ‘www.baidu.com‘: 1465, ‘www.bing.com‘: 777, ‘www.aaa.com‘: 1113101, ‘www.ccc.net.cn‘: 922, ‘www.zhanimei.ga‘: 29847, ‘www.zhanimei.ml‘: 40155, ‘www.zhasini.ml‘: 373436} >>> d.values() [40155, 1113101, 9398, 373436, 777, 79496, 922, 1465, 2477070, 29847] >>> d.keys() [‘www.zhanimei.ml‘, ‘www.aaa.com‘, ‘1.htldxhzj.duapp.com‘, ‘www.zhasini.ml‘, ‘www.bing.com‘, ‘gtxapi.cdn.duapp.com‘, ‘www.ccc.net.cn‘, ‘www.baidu.com‘, ‘www.xxx.com‘, ‘www.zhanimei.ga‘] >>> categories = d.keys() >>> data = d.values()
在views.py里加入上面的代码
categories = d.keys() data = d.values() return render_to_response(‘An_Log/an_log.html‘,{‘user‘:request.user,‘categories‘:categories,‘data‘:data})
好了 一个简单的柱状图就生成了。
Django 如何使用Highcharts,其实我们可以摈弃Django-chartit
标签:style http ar io color os 使用 sp for
原文地址:http://my.oschina.net/jastme/blog/357142