标签:
Highcharts 功能强大、开源、美观、图表丰富、兼容绝大多数浏览器的纯js图表库
http://www.hcharts.cn/product/download.php 下载
一个饼图小例子:
<script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script> <script src="http://cdn.bootcss.com/highcharts/4.2.5/highcharts.js"></script> <script type="text/javascript"> $(function () { $(‘#container‘).highcharts({ chart: { plotBackgroundColor: null, plotBorderWidth: null, plotShadow: false }, title: { text: ‘这里是标题‘ }, tooltip: { //pointFormat: ‘{series.name}: <b>{point.percentage:.1f}%</b>‘ pointFormat: ‘{series.name}: <b>{point.percentage}%</b>‘ }, plotOptions: { pie: { allowPointSelect: true, cursor: ‘pointer‘, dataLabels: { enabled: true, color: ‘#000000‘, connectorColor: ‘#000000‘, format: ‘<b>{point.name}</b>: {point.percentage} %‘ //format: ‘<b>{point.name}</b>: {point.percentage:.1f} %‘ } } }, series: [{ type: ‘pie‘, name: ‘Browser share‘, data: [ [‘家具‘,27], [‘家电‘,20], [‘布艺装饰‘,10], [‘材料费‘,24], [‘人工费‘,10], [‘管理费‘,4], [‘设计费‘,5] /* //这个是被突出的扇形 { name: ‘Chrome‘, y: 12.8, sliced: true, selected: true }*/ ] }] }); }); </script> <div id="container" style="width:900px;height:400px;"></div>
..
标签:
原文地址:http://www.cnblogs.com/qq21270/p/5594688.html