本文實例講述了jQuery插件HighCharts實現的2D回歸直線散點效果。分享給大家供大家參考,具體如下:
1、實例代碼:
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>HighCharts之2D回歸直線的散點</title><script type="text/javascript" src="js/jquery-1.7.2.min.js"></script><script type="text/javascript" src="js/highcharts.js"></script><script type="text/javascript"> $(function(){ $('#scatterLine').highcharts({ chart: { }, xAxis: { //設置X軸最小值和最大值 min: -0.5, max: 5.5 }, yAxis: { //設置Y軸最小值和最大值 min: 0, max: 5 }, title: { text: '(VeVB.COm)回歸直線的散點' }, series: [{ type: 'line', name: '回歸直線', data: [[0, 1.11], [5, 4.51]], marker: { enabled: true }, states: { hover: { lineWidth: 4 //設置折線的寬度 } }, enableMouseTracking: true }, { type: 'scatter', name: '散點', data: [2.2, 1.5, 3.8, 1.5, 3.9, 4.2,5.6], marker: { radius: 10 //散點的半徑 } }] }); });</script></head><body> <div id="scatterLine" style="width: 1200px; height: 500px; margin: 0 auto"></div></body></html>
2、運行效果圖:
附:完整實例代碼點擊此處本站下載。
更多關于jQuery相關內容感興趣的讀者可查看本站專題:《jQuery常用插件及用法總結》、《jquery中Ajax用法總結》、《jQuery表格(table)操作技巧匯總》、《jQuery擴展技巧總結》、《jQuery常見經典特效匯總》及《jquery選擇器用法總結》
希望本文所述對大家jQuery程序設計有所幫助。
新聞熱點
疑難解答