2021-07-30

echarts 散点图加趋势线(可加多条趋势线)个人学习笔记

效果图加代码
2021-07-30
代码:

var data0 = [
    [1,2],
    [2,3],
    [3,4],
    [4,5],
    [5,6],
];
var data1 = [
    [1,5],
    [2,6],
    [3,7],
    [4,8],
    [5,9],
];

var data = [
    [1,2],
    [2,3],
    [3,4],
    [4,5],
    [5,6],
    [1,5],
    [2,6],
    [3,7],
    [4,8],
    [5,9],
];

var myRegression = ecStat.regression('logarithmic', data);
myRegression.points.sort(function(a, b) {
    return a[0] - b[0];
});

console.log(myRegression.points);
myChart.setOption({
    legend: {
        data: ['1990', '2015']
    },
    xAxis: {},
    yAxis: {},
    series: [{
        name: '1990',
        type: 'scatter',
        data: data0
    }, {
        name: '2015',
        type: 'scatter',
        data: data1
    }, {
        name: 'line',
        type: 'line',
        smooth: true,
        showSymbol: false,
        data: myRegression.points,
        markPoint: {
            itemStyle: {
                normal: {
                    color: 'transparent'
                }
            },
            label: {
                normal: {
                    show: true,
                    position: 'left',
                    formatter: myRegression.expression,
                    textStyle: {
                        color: '#333',
                        fontSize: 14
                    }
                }
            },
            data: [{
                coord: myRegression.points[myRegression.points.length - 1]
            }]
        }
    }]
});

主要注意

var myRegression = ecStat.regression('logarithmic', data);

其中用到插件ecstat

vue 项目可直接通过npm安装 npm install echarts-stat --save -dev

或者下载js文件,一般收钱
以下方法可下载
https://github.com/ecomfe/echarts-stat 进入
2021-07-30

2021-07-30

上一篇:ros自定义.srv服务数据,以及服务器的使用


下一篇:JavaScript踩坑(5)比值函数 function(a, b)