将回归方程添加到散点图

时间:2018-05-25 10:04:47

标签: d3.js charts regression scatter-plot c3.js

我有以下图表工作:

var Grade_access = c3.generate({
    bindto: '#grade_access',
    data: {
        url: 'grades_access.csv',
        x: 'Access_grade',
        types: {
            Grade:'scatter',
            Regression: 'line'
        },
    },
    axis: {
        y: {
        label: {
            text: "Average grade",
            position: "outer-middle"
        },
        min: 1,
        max: 9
        },
        x: {
        label: {
            text: "Access grade PAU",
            position: "outer-center"
        },
        min: 9,
        max: 14
        }
    },
    size: {
        height: 400,
        width: 800
    },
    zoom: {
        enabled: true
    },
    legend: {
        show: true,
        position: 'inset',
        inset: {
        anchor: 'top-right',
        x: 20,
        y: 300
        }
    }
})

document.getElementById("equation").innerHTML = "Grade = " + 2 + "·x + " + 1;

grade_access.csv如下所示:

Access_grade,Chemistry I,Regression
9.85,3.8,4.54
10.64,5.0,5.31
10.0,4.0,4.69
10.92,5.4,5.58
11.69,5.5,6.33
11.79,8.0,6.43
11.03,6.3,5.69
10.47,5.0,5.14
10.1,5.6,4.78
12.13,8.5,6.76
11.94,6.4,6.57
10.96,6.7,5.62
10.45,5.9,5.12
10.45,5.7,5.12
12.62,7.7,7.24
10.19,5.0,4.87

但我想改变两件事来改善它:

  • 避免蓝色点与线条结合(我只希望橙色点合并以创建回归线)
  • 显示回归线的真实方程式(现在我构成了系数:2和1不是真实的系数)

有任何帮助吗?提前谢谢!

1 个答案:

答案 0 :(得分:1)

要隐藏连接蓝点的线,您可以检查path元素并使用css隐藏类,或将Grade更改为Chemistry I

由于已经计算了回归值,因此只需很容易地计算系数。

var d1 = data[0];
var d2 = data[1];
var b = (1-(d2['Regression']/d1['Regression']))/((d1['Access_grade']-d2['Access_grade'])/d1['Regression']);
var a = d1['Regression'] - (b * d1['Access_grade']);

我取了前两个数据点,然后就像解决线性方程组一样。

这是你的plunker