HighCharts靜態柱狀圖實現

來源:互聯網
上載者:User
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>
顯示效果如下:



聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.