HighCharts之气泡图
1、HighCharts之气泡图源码
bubble.html:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HighCharts 2D气泡图</title> <script type="text/javascript" src="../scripts/jquery-1.11.0.js"></script> <script type="text/javascript" src="../scripts/js/highcharts.js"></script> <script type="text/javascript"> $(function(){ $('#bubbleChart').highcharts({ chart: { type: 'bubble', zoomType: 'xy' }, title: { text: '气泡图' }, series: [{ data: [[9714,3678,7956],[1294,2374,5860],[9568,4576,1258],[4564,2587,9656],[3668,2567,7893],[2374,3699,4263],[7268,9233,8756],[2351,5669,4230],[3228,2223,3223],[5227,8126,3201]] }, { data: [[2534,1034,8347],[2566,7565,5679],[1167,5774,8776],[8776,5885,9883],[5887,3787,5788],[9078,6543,4344],[3491,3453,1457],[9547,5453,5546],[1545,6457,4458],[5554,2445,8441]] }, { data: [[4347,4457,2561],[2670,1772,4676],[6787,7666,9771],[3868,3780,6660],[5778,9768,6674],[8761,8817,3480],[8343,6450,1433],[6227,7678,7455],[6244,1562,1560],[3560,7657,8442]] }] }); }); </script> </head> <body> <div id="bubbleChart" style="width: 1200px; height: 550px; margin: 0 auto"></div> </body> </html>
2、运行结果