2015-11-05 70 views
2

我正在試圖在Highcharts中基於mx+b(斜率+ y截距)公式繪製線性迴歸線,使用regression-js生成迴歸公式。使用mx + b在Highcharts中繪製迴歸線

我遇到的問題是,Highcharts似乎需要[[x1, y1], [x2, y2]]格式的迴歸線,但我不一定能得到斜坡和y截距的開始和結束。

所以: 是否可以在斜坡上繪製一條基於斜坡的直線?或者是否有一個JS迴歸庫,將輸出一個[[x1, y1], [x2, y2]]格式化的線路,基於數據陣列,就像我在下面得到的那樣?

我與現在的工作是什麼:

data = [[11.6,14.7],[12.2,15.9],[10.7,14.8],[14,11.7],[12.5,13.2],[10,11.3],[10.1,11],[13.5,19.1]]; 

slope = regression('linear', data); // result: slope.equation = [slope, y-intercept] 

$('#scatter').highcharts({ 
    chart: { 
     type: 'scatter', 
     zoomType: 'xy' 
    }, 
    plotOptions: { 
     scatter: { 
      marker: { 
       radius: 5, 
       states: { 
        hover: { 
         enabled: true, 
         lineColor: 'rgb(100,100,100)' 
        } 
       } 
      }, 
      states: { 
       hover: { 
        marker: { 
         enabled: false 
        } 
       } 
      }, 
      tooltip: { 
       headerFormat: '<b>{series.name}</b><br>', 
       pointFormat: '{point.x} cm, {point.y} kg' 
      } 
     } 
    }, 
    series: [ 
     { 
      type: 'line', 
      name: 'Regression Line', 
      data: [[0, 0], [5, 4.51]], // You see the problem here: I've got mx + b and this wants x1 y1 x2 y2 
      marker: { 
       enabled: false 
      }, 
      states: { 
       hover: { 
        lineWidth: 0 
       } 
      }, 
      enableMouseTracking: false 
     }, 
     { 
     name: 'Water Temperature vs. Air Temperature', 
     color: 'rgba(119, 152, 191, .5)', 
     data: data 
    }] 
}); 

回答

2

整潔問題。以下是我做的:

var data = [[11.6,14.7],[12.2,15.9],[10.7,14.8],[14,11.7],[12.5,13.2],[10,11.3],[10.1,11],[13.5,19.1]]; 

var ymxb = regression('linear', data); 

// get the slope and x intercept from the equation 
var m = ymxb.equation[0], b = ymxb.equation[1]; 

// create array of x values 
var xs = []; 
data.forEach(function(d){ 
    xs.push(d[0]); 
}); 

// get the max and min values of x, and calculate 
// the corresponding y value using that x, m, and b 
var x0 = Math.min.apply(null, xs), 
    y0 = m*x0 + b; 
var xf = Math.max.apply(null, xs), 
    yf = m*xf + b; 

... 

// that gives you your two coordinates 
series: [ 
    { 
     type: 'line', 
     name: 'Regression Line', 
     data: [[x0, y0], [xf, yf]], 

... 

結果:

enter image description here

JSFiddle