zx 3 years ago
parent 8ca33ec170
commit 98225d5b0d

@ -1,14 +1,16 @@
// 雷达图
export default function raydarOption(dName = [], dValue = []){
const arr = [];
let max = 0;
let arr = [];
let maxNum = 0;
dValue.forEach(ele => {
if(ele >= max) {max = ele}
if(ele >= maxNum) {
maxNum = ele * 1
}
})
dName.forEach(ele => {
let obj = {
name: ele,
max: max,
max: maxNum,
};
arr.push(obj)
})

@ -1,6 +1,8 @@
import singleLine from "../../../../../components/option/sgOption"
import pieOption from '../../../../../components/option/pieOption'
import raydarOption from '../../../../../components/option/raydarOption'
import pictographicOption from '../../../../../components/option/pictographicOption'
import histogram from "../../../../../components/option/columnarOption"
const app = getApp();
const dColor=['#FF4852','#FF6E25','#FFBF00','#20CC62','#00D6D6']
Component({
@ -8,6 +10,7 @@ Component({
showChart: true,
detailData: '',
affData: {},
imageUrl: getApp().globalData.imageUrl,
ttTransform: singleLine([],[]),
dcActive: 0,
// 论坛调性分布
@ -17,8 +20,29 @@ Component({
dataComp: pieOption(dColor,[]),
dataCompData: [],
// 话题分布
tpActive: 0,
topicData: raydarOption([],[]),
topicUser: []
topicUser: [],
// 主贴用户分析
muActive: 0,
mainUserChart: pieOption(dColor,[]),
mainUserData: [],
// 主贴ID车型分析
mcmActive: 0,
mainIdTypeData: [],
// 主贴ID区域分布
mainIdArea1: pictographicOption([],[]),
mainIdArea2: pictographicOption([],[]),
// 跟帖用户分析
suActive: 0,
subUserChart: pieOption(dColor,[]),
subUserData: [],
// 跟帖ID区域分布
subIdArea1: pictographicOption([],[]),
subIdArea2: pictographicOption([],[]),
// 疑似车黑ID
carHaterId: histogram([],[],[],'#20CC62'),
idEventChart: histogram([],[],[],'#20CC62'),
},
methods: {
getData() {
@ -64,12 +88,106 @@ Component({
}).then(res => {
let dx = []; let dValue = [];
res.forEach(ele => {
dx.push(ele.Time); dValue.push(ele.value)
dx.push(ele.Time);
dValue.push(ele.value)
});
this.setData({ ttTransform: singleLine(dValue,dx) })
});
this.getDataComp();
this.getTopic();
this.getMainUserAnalize();
this.getMainIdType();
this.getSubUserAnalize();
app.globalData.request({
action: 'getRegion', //主贴ID区域分布
token: 't%2BrswgjvzGM=',
sType: 'BbsSeries',
sTimeType: wx.getStorageSync('sTimeType') || 34,
sBrand: wx.getStorageSync('sBrand') || '',
sSeriesName: wx.getStorageSync('sSeriesName') || '',
iBBsType: 2
}).then(res => {
let dr = []; let dv = []; let total = 0;
for(let key in res) {
dr.push(key);
dv.push(res[key]);
total = total + res[key]*1
};
let dr1 = []; let dr2 = []; let dv1 = []; let dv2 = [];
for(let i = 0;i<dr.length;i++) {
if(i % 2 == 0) {
dr1.push(dr[i]);
dv1.push((dv[i]/total*100))
} else {
dr2.push(dr[i]);
dv2.push((dv[i]/total*100))
}
}
this.setData({
mainIdArea1: pictographicOption(dr1,dv1),
mainIdArea2: pictographicOption(dr2,dv2),
})
});
app.globalData.request({
action: 'getRegion', //跟帖ID区域分布
token: 't%2BrswgjvzGM=',
sType: 'BbsSeries',
sTimeType: wx.getStorageSync('sTimeType') || 34,
sBrand: wx.getStorageSync('sBrand') || '',
sSeriesName: wx.getStorageSync('sSeriesName') || '',
iBBsType: 3
}).then(res => {
let dr = []; let dv = []; let total = 0;
for(let key in res) {
dr.push(key);
dv.push(res[key]);
total = total + res[key]*1
};
let dr1 = []; let dr2 = []; let dv1 = []; let dv2 = [];
for(let i = 0;i<dr.length;i++) {
if(i % 2 == 0) {
dr1.push(dr[i]);
dv1.push((dv[i]/total*100))
} else {
dr2.push(dr[i]);
dv2.push((dv[i]/total*100))
}
}
this.setData({
subIdArea1: pictographicOption(dr1,dv1),
subIdArea2: pictographicOption(dr2,dv2),
})
});
app.globalData.request({
action: 'getCarblackUserName', //疑似车黑ID
token: 't%2BrswgjvzGM=',
sType: 'BbsSeries',
sTimeType: wx.getStorageSync('sTimeType') || 34,
sBrand: wx.getStorageSync('sBrand') || '',
sSeriesName: wx.getStorageSync('sSeriesName') || '',
}).then(res => {
let dx = []; let dValue = [];
for(let key in res) {
dx.push(key);
dValue.push(res[key])
}
this.setData({ carHaterId: histogram(dx,dValue,[],'#20CC62')})
});
app.globalData.request({
action: 'getUserRegTime', //跟帖ID注册时间
token: 't%2BrswgjvzGM=',
sType: 'BbsSeries',
sTimeType: wx.getStorageSync('sTimeType') || 34,
sBrand: wx.getStorageSync('sBrand') || '',
sSeriesName: wx.getStorageSync('sSeriesName') || '',
}).then(res => {
let dx = []; let dValue = [];
for(let key in res) {
dx.push(key);
dValue.push(res[key])
}
this.setData({ idEventChart: histogram(dx,dValue,[],'#20CC62')})
});
},
getDataComp() {
app.globalData.request({
@ -97,14 +215,13 @@ Component({
},
getTopic() {
app.globalData.request({
action: 'getPositiveTopic', //话题分布
action: this.data.tpActive==0?'getPositiveTopic':'getNegativeTopic', //话题分布
token: 't%2BrswgjvzGM=',
sType: 'BbsSeries',
sTimeType: wx.getStorageSync('sTimeType') || 34,
sBrand: wx.getStorageSync('sBrand') || '',
sSeriesName: wx.getStorageSync('sSeriesName') || '',
}).then(res => {
console.log(res)
let dName = []; let dValue = [];
let users = [];
for(let key in res.Data) {
@ -118,9 +235,79 @@ Component({
this.setData({topicData: raydarOption(dName,dValue),topicUser: users})
});
},
getMainUserAnalize() {
app.globalData.request({
action: this.data.muActive == 0?'getAttestationSex':'getUserAttestation', //主贴用户分析-性别
token: 't%2BrswgjvzGM=',
sType: 'BbsSeries',
sTimeType: wx.getStorageSync('sTimeType') || 34,
sBrand: wx.getStorageSync('sBrand') || '',
sSeriesName: wx.getStorageSync('sSeriesName') || '',
iBBsType: 2,
}).then(res => {
let arr = [];
for(let key in res) {
let obj = {name: key, value: res[key]};
arr.push(obj);
}
this.setData({mainUserChart: pieOption(dColor,arr), mainUserData: arr})
});
},
getMainIdType() {
app.globalData.request({
action: 'getGuanZhuSeriesname', //主贴ID车型
token: 't%2BrswgjvzGM=',
sType: 'BbsSeries',
sTimeType: wx.getStorageSync('sTimeType') || 34,
sBrand: wx.getStorageSync('sBrand') || '',
sSeriesName: wx.getStorageSync('sSeriesName') || '',
iBBsType: this.data.mcmActive == 0 ? 2 : 3,
}).then(res => {
let arr = [];
for(let key in res) {
let obj = {name: key, value: res[key]};
arr.push(obj)
}
this.setData({mainIdTypeData: arr})
});
},
getSubUserAnalize() {
app.globalData.request({
action: this.data.suActive == 0?'getAttestationSex':'getUserAttestation', //跟帖用户分析-性别
token: 't%2BrswgjvzGM=',
sType: 'BbsSeries',
sTimeType: wx.getStorageSync('sTimeType') || 34,
sBrand: wx.getStorageSync('sBrand') || '',
sSeriesName: wx.getStorageSync('sSeriesName') || '',
iBBsType: 3,
}).then(res => {
let arr = [];
for(let key in res) {
let obj = {name: key, value: res[key]};
arr.push(obj);
}
this.setData({subUserChart: pieOption(dColor,arr), subUserData: arr})
});
},
dcChange(event) {
this.setData({dcActive: event.detail.index});
this.getDataComp()
},
tpChange(event) {
this.setData({tpActive: event.detail.index});
this.getTopic()
},
muChange(event) {
this.setData({muActive: event.detail.index});
this.getMainUserAnalize()
},
mcmChange(event) {
this.setData({mcmActive: event.detail.index});
this.getMainIdType()
},
suChange(event) {
this.setData({suActive: event.detail.index});
this.getSubUserAnalize()
}
},
lifetimes: {

@ -65,9 +65,6 @@
</view>
</view>
<view class="tu-item">
<!-- <view class="tu-chart-title">
数据对比
</view> -->
<view class="tu-area-title">
<view style="width: 25%;">数据对比</view>
<view style="width: 75%;">
@ -98,11 +95,20 @@
</view>
</view>
<view class="tu-item">
<view class="tu-chart-title">话题分布</view>
<view class="tu-area-title">
<view style="width: 55%;">话题分布</view>
<view style="width: 45%;">
<van-tabs type="card" active="{{ tpActive }}" color="#BBBBBB" bind:change="tpChange">
<van-tab title="正面"></van-tab>
<van-tab title="负面"></van-tab>
</van-tabs>
</view>
</view>
<view class="tu-chart-item" style="height: 425rpx;">
<c-echars showChart="{{showChart}}" canvasId="tfb-canvas" chartId="tfb" chartOption="{{topicData}}" height="100%"></c-echars>
</view>
<view class="tu-chart-item">
<view class="tu-chart-title">TOP分发帖用户</view>
<view class="tu-chart-item" style="margin-top: 32rpx;">
<view class="kol-content">
<view class="kol-item" wx:for="{{topicUser}}" wx:key="index" wx:if="{{index < 3}}">
<!-- <image style="width: 64rpx;height: 64rpx;margin-top: 20rpx;" src="{{item._source.profileimgurl}}" /> -->
@ -115,4 +121,122 @@
</view>
</view>
</view>
<view class="tu-item">
<view class="tu-area-title">
<view style="width: 55%;">主贴用户分析</view>
<view style="width: 45%;">
<van-tabs type="card" active="{{ muActive }}" color="#BBBBBB" bind:change="muChange">
<van-tab title="性别"></van-tab>
<van-tab title="认证"></van-tab>
</van-tabs>
</view>
</view>
<view style="display: flex;justify-content: flex-start;">
<view class="circle-chart" style="margin-right: 48rpx;">
<c-echars showChart="{{showChart}}" canvasId="wytotal-canvas" chartId="wytotal" chartOption="{{mainUserChart}}" height="100%"></c-echars>
</view>
<view class="circle-data" style="margin-top: 24rpx;height: auto;">
<view wx:for="{{mainUserData}}" wx:for-item="item" wx:key="name" style="margin-bottom: 64rpx;display: flex;justify-content: space-between;">
<view class="circle-data-item" style="width: 60%;">
<view style="width: 10px;height: 10px;background: #0084FF;border-radius: 1px;"></view>
<view class="circle-data-title">{{item.name}}</view>
</view>
<view class="circle-data-item">
<view>数量</view>
<view class="circle-data-title">{{item.value}}</view>
</view>
</view>
</view>
</view>
</view>
<view class="tu-item">
<view class="tu-area-title">
<view style="width: 55%;">ID车型分析</view>
<view style="width: 45%;">
<van-tabs type="card" active="{{ mcmActive }}" color="#BBBBBB" bind:change="mcmChange">
<van-tab title="主贴ID"></van-tab>
<van-tab title="跟帖ID"></van-tab>
</van-tabs>
</view>
</view>
<view class="tu-rank-list">
<view class="ranking">
<view style="width: 33%;">排名</view>
<view style="width: 33%;">车型</view>
<view style="width: 33%;">数量</view>
</view>
<view class="ranking-number" wx:for="{{mainIdTypeData}}" wx:key="index" wx:if="{{index < 5}}" >
<view style="width: 33%;margin-top: 32rpx;color: #999999;">
<image class="rank_num" wx:if="{{index === 0}}" src="{{imageUrl}}/img_diyi.png"></image>
<image class="rank_num" wx:if="{{index === 1}}" src="{{imageUrl}}/img_dier.png"></image>
<image class="rank_num" wx:if="{{index === 2}}" src="{{imageUrl}}/img_disan.png"></image>
<view class="num" wx:if="{{index !== 0 &&index !== 1 &&index !== 2 }}">{{index >= 9 ? index + 1 : '0' + (index + 1)}}</view>
</view>
<view style="width: 33%;margin-top: 32rpx;color: #333333">{{item.name}}</view>
<view style="width: 33%;margin-top: 32rpx;color: #0084FF">{{item.value}}</view>
</view>
</view>
</view>
<view class="tu-item">
<view class="tu-chart-title">主贴ID区域分布</view>
<view class="area-item" style="padding-left: 16rpx;">
<view class="area-item-chart">
<c-echars showChart="{{showChart}}" canvasId="aua-canvas" chartId="aua" chartOption="{{mainIdArea1}}" height="100%"></c-echars>
</view>
<view class="area-item-chart">
<c-echars showChart="{{showChart}}" canvasId="aua-canvas" chartId="aua" chartOption="{{mainIdArea2}}" height="100%"></c-echars>
</view>
</view>
</view>
<view class="tu-item">
<view class="tu-area-title">
<view style="width: 55%;">跟帖用户分析</view>
<view style="width: 45%;">
<van-tabs type="card" active="{{ suActive }}" color="#BBBBBB" bind:change="suChange">
<van-tab title="性别"></van-tab>
<van-tab title="认证"></van-tab>
</van-tabs>
</view>
</view>
<view style="display: flex;justify-content: flex-start;">
<view class="circle-chart" style="margin-right: 48rpx;">
<c-echars showChart="{{showChart}}" canvasId="wytotal-canvas" chartId="wytotal" chartOption="{{subUserChart}}" height="100%"></c-echars>
</view>
<view class="circle-data" style="margin-top: 24rpx;height: auto;">
<view wx:for="{{subUserData}}" wx:for-item="item" wx:key="name" style="margin-bottom: 64rpx;display: flex;justify-content: space-between;">
<view class="circle-data-item" style="width: 60%;">
<view style="width: 10px;height: 10px;background: #0084FF;border-radius: 1px;"></view>
<view class="circle-data-title">{{item.name}}</view>
</view>
<view class="circle-data-item">
<view>数量</view>
<view class="circle-data-title">{{item.value}}</view>
</view>
</view>
</view>
</view>
</view>
<view class="tu-item">
<view class="tu-chart-title">跟帖ID区域分布</view>
<view class="area-item" style="padding-left: 16rpx;">
<view class="area-item-chart">
<c-echars showChart="{{showChart}}" canvasId="sua-canvas" chartId="sua" chartOption="{{subIdArea1}}" height="100%"></c-echars>
</view>
<view class="area-item-chart">
<c-echars showChart="{{showChart}}" canvasId="sua-canvas" chartId="sua" chartOption="{{subIdArea2}}" height="100%"></c-echars>
</view>
</view>
</view>
<view class="tu-item">
<view class="tu-chart-title">疑似车黑ID</view>
<view class="tu-chart-item">
<c-echars showChart="{{showChart}}" canvasId="chi-canvas" chartId="chiTransBar" chartOption="{{carHaterId}}" height="100%"></c-echars>
</view>
</view>
<view class="tu-item">
<view class="tu-chart-title">跟帖ID注册时间</view>
<view class="tu-chart-item">
<c-echars showChart="{{showChart}}" canvasId="iec-canvas" chartId="iecBar" chartOption="{{idEventChart}}" height="100%"></c-echars>
</view>
</view>
</view>

@ -121,4 +121,37 @@
font-size: 9px;
font-weight: 600;
color: #333333;
}
/* 活跃用户地区 */
.area-item {
display: flex;
width: 656rpx;
height: 410rpx;
padding: 32rpx 0 0 32rpx;
}
.area-item-chart{
width: 358rpx;
height: 410rpx;
}
/* 主贴id车型分析 */
.tu-rank-list {
width: 125%;
margin: 32rpx;
}
.ranking{
display: flex;
justify-content: space-between;
font-size: 12px;
font-weight: 400;
color: #999999;
}
.ranking-number{
display: flex;
justify-content: space-between;
font-size: 14px;
font-weight: 600;
}
.rank_num {
width: 53rpx;
height: 40rpx;
}
Loading…
Cancel
Save