HighCharts静态柱状图实现

来源：互联网发布：深圳交通数据采集编辑：程序博客网时间：2024/05/13 17:21

Highcharts:功能强大、开源、美观、图表丰富、兼容绝大多数浏览器的纯js图表库

Highcharts是一款纯javascript编写的图表库，能够很简单便捷的在Web网站或Web应用中添加交互性的图表，Highcharts目前支持直线图、曲线图、面积图、柱状图、饼图、散点图等多达18种不同类型的图表，可以满足你对Web图表的任何需求！

实例代码如下：

<!doctype html><html lang="en"><head>  <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'        },        title: {            text: 'My first Highcharts chart'        },        xAxis: {            categories: ['my', 'first', 'chart']        },        yAxis: {            title: {                text: 'something'            }        },        series: [{            name: 'Jane',            data: [1, 22, 4]        }, {            name: 'John',            data: [5, 7, 3]        }, {            name: 'Jack',            data: [5, 7, 3]        }]    });});<span style="white-space:pre"></span>  </script></head><body>

显示效果如下：

1 1