Highcharts是一款純javascript編寫的圖表庫，能夠很簡單便捷的在Web網站或Web應用中添加互動性的圖表，Highcharts目前支援直線圖、曲線圖、面積圖、柱狀圖、餅圖、散點圖等多達18種不同類型的圖表，可以滿足你對Web圖表的任何需求 ！
0、引入線上資源（也可以引用本地資源）線上減少伺服器壓力
<script src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
<script src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script>
建立一個html檔案，将highcharts引入到你的頁面後，通過兩個步驟我們就可以建立一個簡單的圖表了。
1、建立div容器
在頁面的 body 部分建立一個div，并指定div 的 id，高度和寬度，代碼如下
<div id="container" style="min-width:800px;height:400px"></div>
2、編寫Highcharts代碼
編寫Highcharts必須的代碼，用<script></script>包裹，代碼可以放在頁面的任意地方，一個最簡單的圖表執行個體代碼如下
$(function () {
$('#container').highcharts({ //圖表展示容器，與div的id保持一緻
chart: {
type: 'column' //指定圖表的類型，預設是折線圖（line）
},
title: {
text: 'My first Highcharts chart' //指定圖表标題
},
xAxis: {
categories: ['my', 'first', 'chart'] //指定x軸分組
},
yAxis: {
title: {
text: 'something' //指定y軸的标題
}
},
series: [{ //指定資料列
name: 'Jane', //資料列名
data: [1, 0, 4] //資料
}, {
name: 'John',
data: [5, 7, 3]
}]
});
}); 完成上述兩個步驟後，儲存檔案并用浏覽器打開，運作結果如下圖所示
上述例子完整html代碼如下
<html>
<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>
$(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, 0, 4]
}, {
name: 'John',
data: [5, 7, 3]
}]
});
});
</script>
</head>
<body>
<div id="container" style="min-width:800px;height:400px;"></div>
</body>
</html> ![拓端tecdat|R語言彈性網絡Elastic Net正則化懲罰回歸模型交叉驗證可視化[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)