option = { title: { text: '', subtext: '' }, tooltip: { trigger: 'axis', axisPointer: { type: 'cross', label: { backgroundColor: '#6a7985' } }, formatter: function(params, ticket, callback) { var tp = params[0].name; params.forEach(function(param) { if (param.value > 0) { tp += '<br/>' + param.seriesName + ':' + param.value.toFixed(1); } }); return tp; } }, legend: { data: [{ name: '未到期存量', icon: 'circle', }, { name: '逾期存量', icon: 'circle', }, { name: '预测存量', icon: 'circle', }, ] }, grid: { left: '0', right: '50px', bottom: '0', containLabel: true }, toolbox: { feature: {}, right: '50px', }, xAxis: { type: 'category', boundaryGap: false, data: [ '2018-02-05', '2018-02-06', '2018-02-07', '2018-02-08', '2018-02-09', '2018-02-10', '2018-02-11', '2018-02-12', '2018-02-13', '2018-02-14', '2018-02-15', '2018-02-16', '2018-02-17', '2018-02-18', '2018-02-19', '2018-02-20', '2018-02-21', '2018-02-22', '2018-02-23', '2018-02-24', '2018-02-25', '2018-02-26', '2018-02-27', '2018-02-28', '2018-03-01', '2018-03-02', '2018-03-03', '2018-03-04', '2018-03-05', '2018-03-06', '2018-03-07', '2018-03-08', '2018-03-09', '2018-03-10', '2018-03-11', '2018-03-12', '2018-03-13', '2018-03-14', '2018-03-15', '2018-03-16', '2018-03-17', '2018-03-18', '2018-03-19', '2018-03-20' ], //name: '放款时间', nameLocation: 'end', axisLine: { symbol: 'none', symbolSize: [6, 10], }, axisPointer: { show: true, type: 'line', lineStyle: { width: 1, }, label: { show: false, } }, axisTick: { interval: function(index, value) { var step = 5; var len = [ '2018-02-05', '2018-02-06', '2018-02-07', '2018-02-08', '2018-02-09', '2018-02-10', '2018-02-11', '2018-02-12', '2018-02-13', '2018-02-14', '2018-02-15', '2018-02-16', '2018-02-17', '2018-02-18', '2018-02-19', '2018-02-20', '2018-02-21', '2018-02-22', '2018-02-23', '2018-02-24', '2018-02-25', '2018-02-26', '2018-02-27', '2018-02-28', '2018-03-01', '2018-03-02', '2018-03-03', '2018-03-04', '2018-03-05', '2018-03-06', '2018-03-07', '2018-03-08', '2018-03-09', '2018-03-10', '2018-03-11', '2018-03-12', '2018-03-13', '2018-03-14', '2018-03-15', '2018-03-16', '2018-03-17', '2018-03-18', '2018-03-19', '2018-03-20' ].length - 1; return index % step == len % step; }, }, axisLabel: { interval: function(index, value) { var step = 5; var len = [ '2018-02-05', '2018-02-06', '2018-02-07', '2018-02-08', '2018-02-09', '2018-02-10', '2018-02-11', '2018-02-12', '2018-02-13', '2018-02-14', '2018-02-15', '2018-02-16', '2018-02-17', '2018-02-18', '2018-02-19', '2018-02-20', '2018-02-21', '2018-02-22', '2018-02-23', '2018-02-24', '2018-02-25', '2018-02-26', '2018-02-27', '2018-02-28', '2018-03-01', '2018-03-02', '2018-03-03', '2018-03-04', '2018-03-05', '2018-03-06', '2018-03-07', '2018-03-08', '2018-03-09', '2018-03-10', '2018-03-11', '2018-03-12', '2018-03-13', '2018-03-14', '2018-03-15', '2018-03-16', '2018-03-17', '2018-03-18', '2018-03-19', '2018-03-20' ].length - 1; return index % step == len % step; }, formatter: function(value, index) { var l = value.slice(-5); return l; } } }, yAxis: { type: 'value', min: 0, //name: '单位(千元)', axisLabel: { formatter: '{value}', }, splitLine: false, axisPointer: { show: false, } }, series: [{ name: '未到期存量', type: 'line', areaStyle: { normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ offset: 0, color: 'rgb(196, 215, 155)', }, { offset: 1, color: 'rgb(196, 215, 155)', }]) } }, itemStyle: { normal: { color: 'rgb(196, 215, 155)', lineStyle: { color: 'rgb(196, 215, 155)', } } }, //smooth: true, //smoothMonotone:'none', stack: 'stack', data: [ 337636.28, 344959.9, 355022.35, 365948.66, 376728, 372785.8, 369154.64, 372571.12, 380872.6, 389395.51, 386331.8, 383214.21, 379242.15, 375959.78, 372350.15, 367153.31, 361312.84, 360199.39, 350389.26, 341107.15, 333858.41, 325287.75, 314569.33, 292041.7, 293643.41, 297970.35, 293158.37, 289739.38, 284965.44, 289851.51, 323711.85 - 26100.43, null, null, null, null, null, null, null, null, null, null, null, null, null ], markPoint: { symbolSize: 96, data: [{ name: '', value: '297611.4', coord: [30, 297611.4], }] }, }, { name: '逾期存量', type: 'line', areaStyle: { normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ offset: 0, color: 'rgb(239, 162, 7)', }, { offset: 1, color: 'rgb(239, 162, 7)', }]) } }, itemStyle: { normal: { color: 'rgb(239, 162, 7)', lineStyle: { color: 'rgb(239, 162, 7)', } } }, //smooth: true, stack: 'stack', data: [21790.6, 21469.46, 21740.43, 21760.49, 21734.37, 21749.6, 21615.71, 21301.5, 21655.92, 21926.74, 22020.29, 22308.8, 22875.44, 23081.04, 23203.79, 23776.04, 24120.1, 24499.76, 25457.82, 26281.9, 26113.25, 25953.19, 25971.63, 29249.78, 29148.16, 29556.13, 28947.3, 26830.31, 25960.02, 26100.43, 26100.43, null, null, null, null, null, null, null, null, null, null, null, null, null ], markPoint: { symbolSize: 96, data: [{ name: '', value: '323711.8', coord: [30, 323711.8], }] }, }, { name: '预测存量', type: 'line', itemStyle: { color: 'rgb(0, 95, 191)', }, lineStyle: { color: 'rgb(0, 95, 191)', opacity: 0.5, }, //smooth: true, data: [null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, 323711.85, 332147.71, 340444.27, 334710.11, 329462.19, 323842.31, 332300.19, 340589.27, 351202.82, 362013.71, 356570.32, 351530.8, 346641.28, 357149.42 ], markLine: { symbol: 'pin', symbolSize: '0', data: [{ xAxis: 30, name: '实际 03-07 预测', label: { normal: { formatter: function(v) { return v.data.name; } } }, lineStyle: { normal: { color: '#ff4500', type: 'dotted', } } }, ] }, markPoint: { symbolSize: 96, data: [{ name: '', value: '357149.4', coord: [43, 357149.4], }] }, /* markArea: { silent: false, label: { //position:['insideTop'], color: '#000', }, data: [ [{ name: '实际', coord:[1,0], itemStyle: { color: 'rgb(239, 239, 239)', opacity: 1, }, }, { coord:[30,500000], }], [{ name: '预测', coord:[30,0], itemStyle: { color: 'rgb(239, 239, 239)', }, }, { coord:[44,500000], }] ] }, */ }, ] };