You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

212 lines
12 KiB

<view class="wb-content">
<view class="wb-item">
<view class="wb-chart-title">微博信息</view>
<view class="wb-chart-item" style="padding: 16rpx 0rpx 16rpx 0rpx;height: 195rpx;">
<view class="wb-data">
<view>信息总量</view><view>参与大V总量</view><view>参与用户数</view>
</view>
<view class="wb-data-number">
<view>{{weiboData.count}}</view><view>{{weiboData.vCount}}</view><view>{{weiboData.userCount}}</view>
</view>
<view class="wb-data">
<view>正面调性</view><view>负面调性</view><view>中性调性</view>
</view>
<view class="wb-data-number">
<view style="color: #0084FF;">{{weiboAff.positive}}%</view>
<view style="color: #FFBF00;">{{weiboAff.negative}}%</view>
<view style="color: #20CC62;">{{weiboAff.middle}}%</view>
</view>
</view>
</view>
<view class="wb-item">
<view class="wb-chart-title">微博传播趋势</view>
<view class="wb-chart-item" style="width: 100%;margin-left: -30rpx;">
<c-echars showChart="{{showChart}}" canvasId="yqTrans-canvas" chartId="yqTransLine" chartOption="{{yqTransform}}" height="100%"></c-echars>
</view>
</view>
<view class="wb-item">
<view class="wb-chart-title">微博KOL</view>
<view class="wb-chart-item" style="display: flex;margin-left: 32rpx;">
<view class="circle-chart" style="margin-right: 48rpx;">
<c-echars showChart="{{showChart}}" canvasId="wbkol-canvas" chartId="wbkol" chartOption="{{weiboKol}}" height="100%"></c-echars>
</view>
<scroll-view class="circle-data" scroll-y>
<view wx:for="{{weiboKolData}}" wx:for-item="item" wx:for-index="index" wx:key="name" style="margin-bottom: 64rpx;display: flex;justify-content: flex-start;">
<view class="circle-data-item">
<view class="colorTags" style="{{colorList[index]}}"></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 class="circle-data-item">
<view>占比</view>
<view class="circle-data-title">{{item.percent}}%</view>
</view>
</view>
</scroll-view>
</view>
</view>
<view class="wb-item">
<view class="wb-chart-title">微博内容类型</view>
<view class="wb-chart-item" style="display: flex;margin-left: 32rpx;">
<view class="circle-chart" style="margin-right: 48rpx;">
<c-echars showChart="{{showChart}}" canvasId="wbtype-canvas" chartId="wbtype" chartOption="{{weiboType}}" height="100%"></c-echars>
</view>
<view class="circle-data">
<view wx:for="{{weiboTypeData}}" wx:for-item="item" wx:key="name" wx:for-index="index" style="margin-bottom: 64rpx;display: flex;justify-content: flex-start;">
<view class="circle-data-item">
<view class="colorTags" style="{{colorList[index]}}"></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 class="circle-data-item">
<view>占比</view>
<view class="circle-data-title">{{item.percent}}%</view>
</view>
</view>
</view>
</view>
</view>
<view class="wb-item">
<view class="wb-area-title">
<view style="width: 45%;">微博人群画像</view>
<view style="width: 55%;">
<van-tabs type="card" active="{{ weiboUserTabActibe }}" color="#BBBBBB" bind:change="changeActive">
<van-tab title="性别"></van-tab>
<van-tab title="认证"></van-tab>
<van-tab title="地区"></van-tab>
</van-tabs>
</view>
</view>
<view class="wb-chart-item" style="display: flex;margin-left: 32rpx;margin-top: 32rpx;">
<view class="circle-chart" style="margin-right: 48rpx;">
<c-echars showChart="{{showChart}}" canvasId="wbuser-canvas" chartId="wbuser" chartOption="{{weiboUserChart}}" height="100%"></c-echars>
</view>
<scroll-view class="circle-data" scroll-y>
<view wx:for="{{weiboRegionData}}" wx:for-item="item" wx:key="name" wx:for-index="index" style="margin-bottom: 64rpx;display: flex;justify-content: flex-start;">
<view class="circle-data-item">
<view class="colorTags" style="{{colorList[index]}}"></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 class="circle-data-item">
<view>占比</view>
<view class="circle-data-title">{{item.percent}}%</view>
</view>
</view>
</scroll-view>
</view>
</view>
<view class="wb-item">
<view class="wb-chart-title">活跃用户地区</view>
<view class="area-item">
<view class="area-item-chart">
<c-echars showChart="{{showChart}}" canvasId="aua-canvas" chartId="aua" chartOption="{{activeUserArea1}}" height="100%"></c-echars>
</view>
<view class="area-item-chart">
<c-echars showChart="{{showChart}}" canvasId="aua-canvas" chartId="aua" chartOption="{{activeUserArea2}}" height="100%"></c-echars>
</view>
</view>
</view>
<view class="wb-item">
<view class="wb-chart-title">微博内容TOP声量</view>
<view class="wb-chart-item">
<c-echars showChart="{{showChart}}" canvasId="wbtopVolumn-canvas" chartId="wbtopVolumn" chartOption="{{weiboTopVolumn}}" height="100%"></c-echars>
</view>
</view>
<view class="wb-item" style="height: 560rpx;">
<view class="wb-area-title">
<view>车型热度</view>
<view>
<van-tabs type="card" active="{{ modalHotActive }}" color="#BBBBBB" bind:change="changeModalHot">
<van-tab title="热门"></van-tab>
<van-tab title="热赞"></van-tab>
<van-tab title="热议"></van-tab>
<van-tab title="热转"></van-tab>
</van-tabs>
</view>
</view>
<view class="wb-rank-list">
<view class="ranking">
<view style="width: 33%;">排名</view>
<view style="width: 33%;text-align: center;">车型</view>
<view style="width: 33%;text-align: right;">传播量</view>
</view>
<view class="ranking-number" wx:for="{{modalHotData}}" wx:key="index" wx:if="{{index < 10}}" >
<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;text-align: center;">{{item.name}}</view>
<view style="width: 33%;margin-top: 32rpx;color: #0084FF;text-align: right;">{{item.value}}</view>
</view>
</view>
</view>
<view class="wb-item">
<view class="wb-chart-title">微博传播裂变</view>
<view class="wb-chart-item">
<c-echars showChart="{{showChart}}" canvasId="wbsp-canvas" chartId="wbsp" chartOption="{{weiboSplit}}" height="100%"></c-echars>
</view>
</view>
<view class="wb-item">
<view class="wb-area-title">
<view style="width: 45%;">热门词云</view>
<view style="width: 55%;">
<van-tabs type="card" active="{{ wordCloudActive }}" color="#BBBBBB" bind:change="changeWordCloud">
<van-tab title="正面"></van-tab>
<van-tab title="负面"></van-tab>
</van-tabs>
</view>
</view>
<word-cloud-car height="{{484}}" list="{{wordCloudObject}}"></word-cloud-car>
</view>
<view class="wb-item">
<view class="wb-chart-title">调性分布</view>
<view class="wb-chart-item" style="height: 560rpx;width: 100%;">
<c-echars showChart="{{showChart}}" canvasId="wbsp-canvas" chartId="wbsp" chartOption="{{affNegaposi}}" height="125%"></c-echars>
</view>
</view>
<view class="wb-item">
<view class="wb-area-title">
<view style="width: 55%;">KOL观点</view>
<view style="width: 45%;">
<van-tabs type="card" active="{{ kolActive }}" color="#BBBBBB" bind:change="changeKolActive">
<van-tab title="正面"></van-tab>
<van-tab title="负面"></van-tab>
</van-tabs>
</view>
</view>
<view class="wb-chart-item" style="height: 410rpx;">
<view class="kol-content">
<view class="kol-item" wx:for="{{kolData}}" wx:key="index" wx:if="{{index < 3}}">
<image style="width: 64rpx;height: 64rpx;margin-top: 20rpx;" src="{{item._source.profileimgurl}}" />
<view class="kol-user-name">{{item._source.user_author.length > 7 ? item._source.user_author.slice(0,7)+'...':item._source.user_author}}</view>
<view style="display: flex;justify-content: space-between;padding: 24rpx 0rpx 0rpx 0rpx;margin-left: 24rpx">
<view class="kol-value">影响力</view>
<view class="kol-value-number">{{item._source.volume}}</view>
</view>
</view>
</view>
<view class="kol-content">
<view class="kol-item" wx:for="{{kolData}}" wx:key="index" wx:if="{{index >= 3}}">
<image style="width: 64rpx;height: 64rpx;margin-top: 20rpx;" src="{{item._source.profileimgurl}}" />
<view class="kol-user-name">{{item._source.user_author.length > 7 ? item._source.user_author.slice(0,7)+'...':item._source.user_author}}</view>
<view style="display: flex;justify-content: space-between;padding: 24rpx 0rpx 0rpx 0rpx;margin-left: 24rpx">
<view class="kol-value">影响力</view>
<view class="kol-value-number">{{item._source.volume}}</view>
</view>
</view>
</view>
</view>
</view>
</view>