房贷echart图表化

#房贷echart图表化
echart示例

const computed = {
    //等额本息计算
    benxi: function (benjin, year, lilv) {
        //每月月供额=〔贷款本金×月利率×(1＋月利率)＾还款月数〕÷〔(1＋月利率)＾还款月数-1〕
        let mouth = year * 12, mouthlilv = lilv / 12, dknum = benjin;
        //每月月供
        let yuegong = (dknum * mouthlilv * Math.pow((1 + mouthlilv), mouth)) / (Math.pow((1 + mouthlilv), mouth) - 1);
        //总利息=还款月数×每月月供额-贷款本金
        let totalLixi = mouth * yuegong - dknum;
        //还款总额 总利息+贷款本金
        let totalPrice = totalLixi + dknum, leftFund = totalLixi + dknum;
        //循环月份
        let mouthdataArray = [], nowmouth = new Date().getMonth(), realmonth = 0;
        for (let i = 1; i <= mouth; i++) {
            realmonth = nowmouth + i;
            let yearlist = Math.floor(i / 12);
            realmonth = realmonth - 12 * yearlist;
            if (realmonth > 12) {
                realmonth = realmonth - 12;
            }
            //console.log(realmonth)
            //每月应还利息=贷款本金×月利率×〔(1+月利率)^还款月数-(1+月利率)^(还款月序号-1)〕÷〔(1+月利率)^还款月数-1〕
            let yuelixi = dknum * mouthlilv * (Math.pow((1 + mouthlilv), mouth) - Math.pow((1 + mouthlilv), i - 1)) / (Math.pow((1 + mouthlilv), mouth) - 1);
            //每月应还本金=贷款本金×月利率×(1+月利率)^(还款月序号-1)÷〔(1+月利率)^还款月数-1〕
            let yuebenjin = dknum * mouthlilv * Math.pow((1 + mouthlilv), i - 1) / (Math.pow((1 + mouthlilv), mouth) - 1);
            leftFund = leftFund - (yuelixi + yuebenjin);
            if (leftFund < 0) {
                leftFund = 0;
            }
            mouthdataArray[i - 1] = {
                monthName: realmonth + "月",
                yuelixi: yuelixi,
                yuebenjin: yuebenjin,
                //剩余还款
                leftFund: leftFund
            };
        }
        return {
            yuegong: yuegong,
            totalLixi: totalLixi,
            totalPrice: totalPrice,
            mouthdataArray: mouthdataArray,
            totalDknum: benjin,
            year: year
        };
    },
    //等额本金计算
    benjin: function (benjin, year, lilv) {
        let mouth = year * 12, mouthlilv = lilv / 12, dknum = benjin, yhbenjin = 0; //首月还款已还本金金额是0
        //每月应还本金=贷款本金÷还款月数
        let everymonthyh = dknum / mouth;
        //每月月供额=(贷款本金÷还款月数)+(贷款本金-已归还本金累计额)×月利率
        let yuegong = everymonthyh + (dknum - yhbenjin) * mouthlilv;
        //每月月供递减额=每月应还本金×月利率=贷款本金÷还款月数×月利率
        let yuegongdijian = everymonthyh * mouthlilv;
        //总利息=〔(总贷款额÷还款月数+总贷款额×月利率)+总贷款额÷还款月数×(1+月利率)〕÷2×还款月数-总贷款额
        let totalLixi = ((everymonthyh + dknum * mouthlilv) + dknum / mouth * (1 + mouthlilv)) / 2 * mouth - dknum;
        //还款总额 总利息+贷款本金
        let totalPrice = totalLixi + dknum, leftFund = totalLixi + dknum;
        //循环月份
        let mouthdataArray = [], nowmouth = new Date().getMonth(), realmonth = 0;
        for (let i = 1; i <= mouth; i++) {
            realmonth = nowmouth + i;
            let yearlist = Math.floor(i / 12);
            realmonth = realmonth - 12 * yearlist;
            if (realmonth > 12) {
                realmonth = realmonth - 12;
            }
            yhbenjin = everymonthyh * (i - 1);
            let yuebenjin = everymonthyh + (dknum - yhbenjin) * mouthlilv;
            //每月应还利息=剩余本金×月利率=(贷款本金-已归还本金累计额)×月利率
            let yuelixi = (dknum - yhbenjin) * mouthlilv;
            leftFund = leftFund - yuebenjin;
            if (leftFund < 0) {
                leftFund = 0;
            }
            mouthdataArray[i - 1] = {
                monthName: realmonth + "月",
                yuelixi: yuelixi,
                //每月本金
                yuebenjin: everymonthyh,
                //剩余还款
                leftFund: leftFund
            };
        }
        return {
            yuegong: yuegong,
            totalLixi: totalLixi,
            totalPrice: totalPrice,
            yuegongdijian: yuegongdijian,
            mouthdataArray: mouthdataArray,
            totalDknum: benjin,
            year: year
        };
    }
};
const echartOption = {
    tooltip: {
        trigger: 'axis'
    },
    xAxis: {
        type: 'category',
        data: []
    },
    yAxis: [
        {
            type: 'value',
            name: '月供'
        }, {
            type: 'value',
            name: '利息'
        }
    ],
    series: []
};
const xAxisData = [];
const benxiYuegong = {
    type: 'line',
    name: '月供(本息)',
    data: []
};
const benxiTotalLixi = {
    type: 'line',
    name: '总利息(本息)',
    yAxisIndex: 1,
    data: []
};
const benxiTotalPrice = {
    type: 'line',
    name: '总金额(本息)',
    data: []
};
const benjinYuegong = {
    type: 'line',
    name: '月供(本金)',
    data: []
};
const benjinTotalLixi = {
    type: 'line',
    name: '总利息(本金)',
    yAxisIndex: 1,
    data: []
};
const benjinTotalPrice = {
    type: 'line',
    name: '总金额(本金)',
    data: []
};
const benjin = {
    type: 'line',
    name: '本金',
    data: []
};
echartOption.xAxis.data = xAxisData;
echartOption.series.push(benxiYuegong);
echartOption.series.push(benxiTotalLixi);
// echartOption.series.push(benxiTotalPrice);
echartOption.series.push(benjinYuegong);
echartOption.series.push(benjinTotalLixi);
// echartOption.series.push(benjinTotalPrice);
const YEAR = 30 ;
const BEN_JIN = 1090000;
const LI_LV = 0.039;
for (let yaer = 1; yaer <= YEAR; yaer++) {
    xAxisData.push(`${yaer}年`);
    const benxiResult = computed.benxi(BEN_JIN, yaer, LI_LV);
    const benjinResult = computed.benjin(BEN_JIN, yaer, LI_LV);
    benxiYuegong.data.push(benxiResult.yuegong.toFixed());
    benxiTotalLixi.data.push(benxiResult.totalLixi.toFixed());
    benxiTotalPrice.data.push(benxiResult.totalPrice.toFixed());
    benjinYuegong.data.push(benjinResult.yuegong.toFixed());
    benjinTotalLixi.data.push(benjinResult.totalLixi.toFixed());
    benjinTotalPrice.data.push(benjinResult.totalPrice.toFixed());
    benjin.data.push(BEN_JIN.toFixed());
}


option  = echartOption