HighCharts之2D回归直线的散点

来源:互联网 发布:采购数据分析 编辑:程序博客网 时间:2024/05/23 23:33

HighCharts之2D回归直线的散点


1、实例源码

ScatterLine.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(){     $('#scatterLine').highcharts({             chart: {             },             xAxis: {  //设置X轴最小值和最大值                 min: -0.5,                 max: 5.5             },             yAxis: {  //设置Y轴最小值和最大值                 min: 0,                 max: 5             },             title: {                 text: '回归直线的散点'             },             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><!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(){     $('#scatterLine').highcharts({             chart: {             },             xAxis: {  //设置X轴最小值和最大值                 min: -0.5,                 max: 5.5             },             yAxis: {  //设置Y轴最小值和最大值                 min: 0,                 max: 5             },             title: {                 text: '回归直线的散点'             },             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、实例结果


1 0