|
|
|
|
@ -2,7 +2,70 @@
|
|
|
|
|
import * as echarts from '../../components/ec-canvas/echarts'; |
|
|
|
|
|
|
|
|
|
const app = getApp(); |
|
|
|
|
const $api = require('../../utils/api').API; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var option = { |
|
|
|
|
title: { |
|
|
|
|
text: '我的预测与成交溢价率的差异', |
|
|
|
|
left: 'center' |
|
|
|
|
}, |
|
|
|
|
legend: { |
|
|
|
|
data: ['溢价率差异', '平均差异', '我的净利率'], |
|
|
|
|
bottom: 50, |
|
|
|
|
left: 'center', |
|
|
|
|
z: 100 |
|
|
|
|
}, |
|
|
|
|
grid: { |
|
|
|
|
containLabel: true |
|
|
|
|
}, |
|
|
|
|
tooltip: { |
|
|
|
|
show: true, |
|
|
|
|
trigger: 'axis' |
|
|
|
|
}, |
|
|
|
|
xAxis: { |
|
|
|
|
type: 'category', |
|
|
|
|
boundaryGap: false, |
|
|
|
|
data: ['21001', '21002', '21003', '21004', '21005', '21006', '21007', '21008', '21009', '210010'], |
|
|
|
|
show: false |
|
|
|
|
}, |
|
|
|
|
yAxis: { |
|
|
|
|
x: 'center', |
|
|
|
|
type: 'value', |
|
|
|
|
position: 'right', |
|
|
|
|
offset: 5, |
|
|
|
|
axisLabel: { |
|
|
|
|
formatter: '{value}.00%' |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
series: [{ |
|
|
|
|
name: '溢价率差异', |
|
|
|
|
type: 'bar', |
|
|
|
|
smooth: true, |
|
|
|
|
data: [], |
|
|
|
|
itemStyle: { |
|
|
|
|
color: '#9BBB59' |
|
|
|
|
} |
|
|
|
|
}, { |
|
|
|
|
name: '平均差异', |
|
|
|
|
type: 'line', |
|
|
|
|
data: [], |
|
|
|
|
showSymbol: false, |
|
|
|
|
lineStyle: { |
|
|
|
|
color: '#76589B', |
|
|
|
|
width: 5 |
|
|
|
|
} |
|
|
|
|
}, { |
|
|
|
|
name: '我的净利率', |
|
|
|
|
type: 'line', |
|
|
|
|
showSymbol: false, |
|
|
|
|
data: [], |
|
|
|
|
lineStyle: { |
|
|
|
|
color: '#4BACC6', |
|
|
|
|
width: 5 |
|
|
|
|
} |
|
|
|
|
}] |
|
|
|
|
}; |
|
|
|
|
function initChart(canvas, width, height, dpr) { |
|
|
|
|
const chart = echarts.init(canvas, null, { |
|
|
|
|
width: width, |
|
|
|
|
@ -11,67 +74,7 @@ function initChart(canvas, width, height, dpr) {
|
|
|
|
|
}); |
|
|
|
|
canvas.setChart(chart); |
|
|
|
|
|
|
|
|
|
var option = { |
|
|
|
|
title: { |
|
|
|
|
text: '我的预测与成交溢价率的差异', |
|
|
|
|
left: 'center' |
|
|
|
|
}, |
|
|
|
|
legend: { |
|
|
|
|
data: ['溢价率差异', '平均差异', '我的净利率'], |
|
|
|
|
bottom: 50, |
|
|
|
|
left: 'center', |
|
|
|
|
z: 100 |
|
|
|
|
}, |
|
|
|
|
grid: { |
|
|
|
|
containLabel: true |
|
|
|
|
}, |
|
|
|
|
tooltip: { |
|
|
|
|
show: true, |
|
|
|
|
trigger: 'axis' |
|
|
|
|
}, |
|
|
|
|
xAxis: { |
|
|
|
|
type: 'category', |
|
|
|
|
boundaryGap: false, |
|
|
|
|
data: ['21001', '21002', '21003', '21004', '21005', '21006', '21007', '21008', '21009', '210010'], |
|
|
|
|
show: false |
|
|
|
|
}, |
|
|
|
|
yAxis: { |
|
|
|
|
x: 'center', |
|
|
|
|
type: 'value', |
|
|
|
|
position: 'right', |
|
|
|
|
offset: 5, |
|
|
|
|
axisLabel: { |
|
|
|
|
formatter: '{value}.00%' |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
series: [{ |
|
|
|
|
name: '溢价率差异', |
|
|
|
|
type: 'bar', |
|
|
|
|
smooth: true, |
|
|
|
|
data: [17, 19, -16, -2, 8, 10, 5, 3, 2, 6], |
|
|
|
|
itemStyle: { |
|
|
|
|
color: '#9BBB59' |
|
|
|
|
} |
|
|
|
|
}, { |
|
|
|
|
name: '平均差异', |
|
|
|
|
type: 'line', |
|
|
|
|
data: [3, 11, 13, -2, 8, 16, 3, 3, 2, 6], |
|
|
|
|
showSymbol: false, |
|
|
|
|
lineStyle: { |
|
|
|
|
color: '#76589B', |
|
|
|
|
width: 5 |
|
|
|
|
} |
|
|
|
|
}, { |
|
|
|
|
name: '我的净利率', |
|
|
|
|
type: 'line', |
|
|
|
|
showSymbol: false, |
|
|
|
|
data: [17, 19, -16, -2, 8, 10, 5, 3, 2, 6], |
|
|
|
|
lineStyle: { |
|
|
|
|
color: '#4BACC6', |
|
|
|
|
width: 5 |
|
|
|
|
} |
|
|
|
|
}] |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
chart.setOption(option); |
|
|
|
|
return chart; |
|
|
|
|
@ -82,26 +85,77 @@ Page({
|
|
|
|
|
return { |
|
|
|
|
title: 'ECharts 可以在微信小程序中使用啦！', |
|
|
|
|
path: '/pages/index/index', |
|
|
|
|
success: function () {}, |
|
|
|
|
fail: function () {} |
|
|
|
|
success: function () { }, |
|
|
|
|
fail: function () { } |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
data: { |
|
|
|
|
ec: { |
|
|
|
|
onInit: initChart |
|
|
|
|
} |
|
|
|
|
onInit: {}, |
|
|
|
|
}, |
|
|
|
|
totle: 0, |
|
|
|
|
precision: 0, |
|
|
|
|
error: 0, |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
// 测算结果统计
|
|
|
|
|
getStatistics() { |
|
|
|
|
$api.AJAX("GET", '/applets/measuredata/statistics', {}, true).then(res => { |
|
|
|
|
this.setData({ |
|
|
|
|
totle: res.data.totle, |
|
|
|
|
precision: res.data.precision, |
|
|
|
|
error: res.data.error, |
|
|
|
|
}) |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
// 测算趋势统计
|
|
|
|
|
getTrend() { |
|
|
|
|
console.log(option); |
|
|
|
|
let premiumSpread = option.series[0].data; |
|
|
|
|
let average = option.series[1].data; |
|
|
|
|
let interestRate = option.series[2].data; |
|
|
|
|
|
|
|
|
|
$api.AJAX("GET", '/applets/measuredata/trend', {}, true).then(res => { |
|
|
|
|
res.data.map(liem => { |
|
|
|
|
average.push( |
|
|
|
|
liem.average |
|
|
|
|
) |
|
|
|
|
interestRate.push( |
|
|
|
|
liem.interestRate |
|
|
|
|
) |
|
|
|
|
premiumSpread.push( |
|
|
|
|
liem.premiumSpread |
|
|
|
|
) |
|
|
|
|
}) |
|
|
|
|
option.series[0].data = premiumSpread; |
|
|
|
|
option.series[1].data = average; |
|
|
|
|
option.series[2].data = interestRate; |
|
|
|
|
|
|
|
|
|
onShow(){ |
|
|
|
|
this.setData({ |
|
|
|
|
['ec.onInit']: initChart |
|
|
|
|
}) |
|
|
|
|
this.instance(); |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
instance() {//实例图表
|
|
|
|
|
console.log('实例图表') |
|
|
|
|
let myComponent = this.selectComponent('#mychart-dom-line'); |
|
|
|
|
console.log(myComponent) |
|
|
|
|
myComponent.initFun() // 调用自定义组件中的方法
|
|
|
|
|
}, |
|
|
|
|
onShow() { |
|
|
|
|
if (typeof this.getTabBar === 'function' && |
|
|
|
|
this.getTabBar()) { |
|
|
|
|
this.getTabBar().setData({ |
|
|
|
|
selected: 3 |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
this.getTabBar()) { |
|
|
|
|
this.getTabBar().setData({ |
|
|
|
|
selected: 3 |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
this.getStatistics(); |
|
|
|
|
this.getTrend(); |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
comeHistory(){ |
|
|
|
|
comeHistory() { |
|
|
|
|
wx.navigateTo({ |
|
|
|
|
url: '../../pages/history/history', |
|
|
|
|
}) |
|
|
|
|
|
1191151619
4 years ago