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="width:100%;display:block;">
        <tr>
            <td id="haha" width="50%" style="display:block;">        
                <!-- 量值溯源誤差趨勢 -->
                <div class="spDiv" style="position:auto;height: 450px;width:100%;">
                <div id="showLedgerCountBar" style="height:100%;width: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