zoukankan      html  css  js  c++  java
  • echarts 图 折线图、热力图添加趋势拟合线,ecStat

    线性拟合,

    回归算法如何把数据分析与echarts 图表结合

     echarts 的一个扩展库:echarts-stat.js

    ecStat 是 ECharts 的统计和数据挖掘工具。

    直接引用或者下载:

    <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts-stat/ecStat.min.js"></script>
    

      调用:

    var myRegression = ecStat.regression(regressionType, data, order);
    

      

    参数说明
    regressionType:回归类型(String),有四种回归算法类型:'linear', 'exponential', 'logarithmic', 'polynomial'
    data:要统计的数据,是个二维数组(Array),一维数组值分别表示自变量和因变量的值。
    order:多项式的阶数(number)。对于非多项式回归,可以忽略该参数。
     
    返回值说明
    myRegression:返回一个对象. 包括用于绘制折线图的拟合数据点 points,回归曲线的参数 parameter,以及拟合出的曲线表达式 expression。如下:
     
    // 绘制折线图的拟合数据点
     myRegression.points = [
        [1, 2],
        [3, 4],
        ...
     ];
    
     // 这是线性回归到额参数,对于其它的回归类型,返回值有所不同
     myRegression.parameter = {
        gradient: 1.695,
        intercept: 3.008
     };
    
    // 拟合曲线的表达式
     myRegression.expression = 'y = 1.7x + 3.01';
    

      示例数据:

     <table id="tblSearch" class="search_all" style="100%;display:block;">
            <tr>
                <td id="haha" width="50%" style="display:block;">        
                    <!-- 量值溯源误差趋势 -->
                    <div class="spDiv" style="position:auto;height: 450px;100%;">
                    <div id="showLedgerCountBar" style="height:100%;100%;"></div>
                    </div>
                </td>
            </tr>
        </table>
       
       <script language="javascript">
       var dataEcstat = [
        [1990, 97.50795611],
        [1991, -1.47594249]
        ]
        init();
        
        function init(){
            ledgerCountBar();
        }
        
    
        function ledgerCountBar(){
            var ledgerCount = echarts.init(document.getElementById('showLedgerCountBar'));
    
           
            var regressionDemo = ecStat.regression( "linear", dataEcstat, 1);
    
            
            
            option = {
                    title: {
                    text: ' 折线图',
                                subtext: ' ',
                                left: 'center'
                            },
                     tooltip: {
                                trigger: 'item',
                                formatter: '{a} <br/>{b} : {c}'
                            },
                    xAxis: {
                        type: 'category'
                       
                    },
                    yAxis: {
                        type: 'value'
                    },
                    series: [{
                         name: '数据',
                         label: {
                                        show: true,
                                        position: "top",
                                         formatter:' {c}'
                                      },
                        data: dataEcstat,
                        type: 'line'
                    },
                    {
                         name: '误差趋势拟合',
                         label: {
                                        show: true,
                                        position: "top",
                                         formatter:' {c}'
                                      },
                        data:  regressionDemo.points,
                        lineStyle: {
                           color: "#f00"
                       },
                        type: 'line'
                    }
                    ]
                };
    
            ledgerCount.setOption(option);
            window.onresize = ledgerCount.resize;
        }
        
    
        
        
    </script>

    参考:https://www.jianshu.com/p/c97273a05167

     
     
  • 相关阅读:
    关于联想笔记本ThinkPad E470 没有外音 插耳机却有声音的解决办法
    Win10无法启动软件提示MSVCP110.dll丢失
    POJ-3984 迷宫问题(BFS找最短路径并保存)
    转圈游戏(简单的快速幂)
    统计一个整数的二进制中1的个数(暴力)
    手写哈希(实现简单的加数、查询)
    CodeForces
    L2-2 社交集群 (25 分)(一个写挫的并查集)
    7-4 交换二叉树中每个结点的左孩子和右孩子 (20 分)
    7-3 堆中的路径 (25 分)
  • 原文地址:https://www.cnblogs.com/ltian123/p/13471019.html
Copyright © 2011-2022 走看看