// pages/result/result.js const { throttle } = require('../../utils/util.js') const wxCharts = require("../../utils/wxcharts-min.js"); const app = getApp(); var numCount = 6; var numSlot = 10; var sys = wx.getSystemInfoSync(); var windowWidth = sys.windowWidth; var mW = windowWidth; var mH = 520; var mCenter = mW/ 2.33; //中心点 var mAngle = Math.PI * 2 / numCount; //角度 var mRadius = mCenter - 60; //半径(减去的值用于给绘制的文本留空间) //获取Canvas var radCtx = wx.createCanvasContext("result") Page({ /** * 页面的初始数据 */ data: { number:0, isRefer:0, isTest:1, statusBar: app.globalData.statusBar, isHistory:0, list:[ { text: '图形推理', value:36, appraisal: '图形推理这么强,你上辈⼦⼀定是裁缝!' }, { text: '心理旋转', value: 48, appraisal: '你对物体旋转的观察⼒都超过我了!' }, { text: '空间想象', value: 64, appraisal: '你这空间想象⼒,不当建筑师⽩瞎了!' }, { text: '视觉搜索', value: 85, appraisal: '搜索能⼒这么强,你的脑袋上⼀定装了雷达!' }, { text: '工作记忆', value:60, appraisal: '好强的观察能⼒,⼀点点的变化都逃不过你的法眼!' }, { text: '执行功能', value: 100, appraisal: '反应能⼒这么快,你⼀定练过武!' } ] }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { console.log(options) this.setData(options); app.getWxloginCode(code => { this.setData({ code }) }) const { isRefer,list}=this.data const userInfo = wx.getStorageSync('userInfo') if (userInfo) { this.setData({ userInfo}) } if (isRefer == 1) { const { graphicReasoning,spaceImagination,executionFunctionality,visualSearch,workingMemory,mentalRotation,list } = this.data var score = Number(spaceImagination) + Number(executionFunctionality) + Number(visualSearch) + Number(workingMemory) + Number(mentalRotation) + Number(graphicReasoning); list[0].value=graphicReasoning list[1].value=mentalRotation list[2].value=spaceImagination list[3].value=visualSearch list[4].value=workingMemory list[5].value=executionFunctionality this.setData({ score:score,list,isTest:0}) const arr=[] for(var i in list){ if(list[i].value>90||list[i].value==90){ arr.push(list[i].appraisal) } } // if(arr.length>0){ // this.setData({ appraisal: arr[Math.floor(Math.random()*(arr.length))] }) // if(arr.length>5){ // this.setData({ appraisal: '我的天,你的⼤脑⼀定被爱因斯坦摸过!' }) // } // }else if(score<361){ this.setData({ appraisal: '原来你和我⼀样都是普通⼈!' }) // } this.drawRadar(); this.addScore(); }else{ this.findResult() } }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady: function () { }, /** * 生命周期函数--监听页面显示 */ onShow: function () { }, /** * 生命周期函数--监听页面隐藏 */ onHide: function () { }, /** * 生命周期函数--监听页面卸载 */ onUnload: function () { }, /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () { }, /** * 页面上拉触底事件的处理函数 */ onReachBottom: function () { }, /** * 用户点击右上角分享 */ onShareAppMessage: function () { if (app.sharePageDefaultCtl) { return app.sharePageDefaultCtl() } }, /** * 路由跳转 */ navigateCtl: app.navigateCtl, /** * 底部导航跳转 */ redirectCtl: app.redirectCtl, /** * 返回上一级页面 */ blockCtl: function () { const {isHistory}=this.data if(isHistory==1){ this.redirectCtl({ url: 'history', method: {} }, true) }else{ this.redirectCtl({ url: 'me', method: {} }, true) } }, /** * 微信授权 */ bindGetUserInfo: function (e) { const { code } = this.data; if (e.detail.userInfo) { app.saveUserInfo(e.detail, code) } else { wx.showToast({ title: '微信授权失败', icon: 'none' }) } }, // 知识报告雷达 knowledgeCanvas: function () { var sys = wx.getSystemInfoSync(); var windowWidth = sys.windowWidth; const { graphicReasoning,spaceImagination,executionFunctionality,visualSearch,workingMemory,mentalRotation } = this.data; // console.log(graphicReasoning,spaceImagination,executionFunctionality,visualSearch,workingMemory,mentalRotation); new wxCharts({ animation: true, canvasId: 'result', type: 'radar', categories: ['空间想象', '执行功能', '视觉搜索', '工作记忆','心理旋转','图形推理'], series: [{ name: '', data: [spaceImagination, executionFunctionality, visualSearch, workingMemory, mentalRotation, graphicReasoning], }], width: windowWidth, height: 250, dataPointShape: true, legend: false, extra: { radar: { max: 100,//雷达数值的最大值 gridColor: '#000', labelColor: '#000' } } }); }, /** * 保存游戏结果 */ addScore: function () { const postData = { fn: this.addScore, param: { ...arguments } } var that=this; const { gameRespondentId,appraisal, score,level,graphicReasoning,spaceImagination,executionFunctionality,visualSearch,workingMemory,mentalRotation} = that.data; app.post('/api/game/v2/saveV2', { gameRespondentId,appraisal, score, level,graphicReasoning,spaceImagination,executionFunctionality,visualSearch,workingMemory,mentalRotation}, 0, postData).then(res => { // wx.showToast({ // title: '保存成功', // icon: 'none' // }) }) }, /** * 查询测试结果 */ findResult:function(){ const postData = { fn: this.findResult, param: { ...arguments } } var that = this; const {list,gameRecordId=''}=this.data; app.post('/api/game/v2/findResult', {gameRecordId}, 0, postData).then(res => { const { appraisal, score, level,totalScore,graphicReasoning,spaceImagination,executionFunctionality,visualSearch,workingMemory,mentalRotation}=res.data; list[0].value=graphicReasoning list[1].value=mentalRotation list[2].value=spaceImagination list[3].value=visualSearch list[4].value=workingMemory list[5].value=executionFunctionality that.setData({ appraisal, score, level,totalScore,graphicReasoning,spaceImagination,executionFunctionality,visualSearch,workingMemory,mentalRotation,list,isTest:0}); that.drawRadar(); }) }, /** * 去测试 */ getTest:function(){ const { level, ageGroup} = this.data; this.redirectCtl({ url: 'set_info', method: {} }, true) // if (ageGroup < 0) { // this.redirectCtl({ url: 'set_info', method: { level: 0, ageGroup } }, true) // } else { // this.redirectCtl({ url: 'tu_xing_tui_li', method: { level: 0, ageGroup } }, true) // } }, /** * 挑战下一关 */ nextCard:function(){ const { level, ageGroup } = this.data; console.log(level, ageGroup) this.redirectCtl({ url: 'tu_xing_tui_li', method: { level: level+1, ageGroup } }, true) }, // 雷达图 drawRadar:function(){ // var sourceData1 = this.data.chanelArray1 const { graphicReasoning,spaceImagination,executionFunctionality,visualSearch,workingMemory,mentalRotation } = this.data; var sourceData1 = [['空间想象',spaceImagination], ['执行功能',executionFunctionality], ['视觉搜索',visualSearch], ['工作记忆',workingMemory],['心理旋转',mentalRotation],['图形推理',graphicReasoning]] //调用 this.drawEdge() //画六边形 //this.drawArcEdge() //画圆 this.drawLinePoint() //设置数据 this.drawRegion(sourceData1,'rgba(118,205,255,0.7)') //第一个人的 //设置文本数据 this.drawTextCans(sourceData1) //设置节点 this.drawCircle(sourceData1,'#76CDFF') // this.drawCircle(sourceData2,'yellow') //开始绘制 radCtx.draw() }, // 绘制6条边 drawEdge: function(){ radCtx.setStrokeStyle("#000000") radCtx.setLineWidth(1) //设置线宽 for (var i = 0; i < numSlot; i++) { //计算半径 radCtx.beginPath() var rdius = mRadius / numSlot * (i + 1) //画6条线段 for (var j = 0; j < numCount; j++) { //坐标 var x = mCenter + rdius * Math.cos(mAngle * j); var y = mCenter + rdius * Math.sin(mAngle * j); radCtx.lineTo(x, y); } radCtx.closePath() radCtx.stroke() } }, // 绘制连接点 drawLinePoint:function(){ radCtx.beginPath(); for (var k = 0; k < numCount; k++) { var x = mCenter + mRadius * Math.cos(mAngle * k); var y = mCenter + mRadius * Math.sin(mAngle * k); radCtx.moveTo(mCenter, mCenter); radCtx.lineTo(x, y); } radCtx.stroke(); }, //绘制数据区域(数据和填充颜色) drawRegion: function (mData,color){ radCtx.beginPath(); for (var m = 0; m < numCount; m++){ var x = mCenter + mRadius * Math.cos(mAngle * m) * mData[m][1] / 100; var y = mCenter + mRadius * Math.sin(mAngle * m) * mData[m][1] / 100; radCtx.lineTo(x, y); } radCtx.closePath(); radCtx.setFillStyle(color) radCtx.fill(); }, //绘制文字 drawTextCans: function (mData){ radCtx.setFillStyle("#000000") radCtx.font = 'bold 13px cursive' //设置字体 for (var n = 0; n < numCount; n++) { var x = mCenter + mRadius * Math.cos(mAngle * n); var y = mCenter + mRadius * Math.sin(mAngle * n); // radCtx.fillText(mData[n][0], x, y); //通过不同的位置,调整文本的显示位置 if (mAngle * n >= 0 && mAngle * n <= Math.PI / 2) { radCtx.fillText(mData[n][0], x+5, y+5); } else if (mAngle * n > Math.PI / 2 && mAngle * n <= Math.PI) { radCtx.fillText(mData[n][0], x - radCtx.measureText(mData[n][0]).width-7, y+5); } else if (mAngle * n > Math.PI && mAngle * n <= Math.PI * 3 / 2) { radCtx.fillText(mData[n][0], x - radCtx.measureText(mData[n][0]).width-5, y); } else { radCtx.fillText(mData[n][0], x+7, y+2); } } }, //画点 drawCircle: function(mData,color){ var r = 3; //设置节点小圆点的半径 for(var i = 0; i