用户画像

dev
wylyl22 3 years ago
parent 6a95c74d17
commit e93300a0d5

@ -14,7 +14,6 @@ Component({
}, },
confine: true confine: true
}, },
legend: { legend: {
x:'15', x:'15',
icon: 'rectangle',//data图标样式 icon: 'rectangle',//data图标样式

@ -1,4 +1,8 @@
const datas=[
{ value: 1650245, name: '女性' },
{ value: 1650245, name: '未知' },
{ value: 3307418, name: '男性' },
]
Component({ Component({
data: { data: {
showChart: true, showChart: true,
@ -11,14 +15,17 @@ Component({
// type: 'scroll', // type: 'scroll',
orient: 'vertical', orient: 'vertical',
right: 140, right: 140,
top: 'center', // top:'center',
padding:[10,0,10,0], bottom: '100',
itemWidth: 10,//data图标大小
itemHeight: 10,
itemGap: 45//图标之间间距
}, },
// 环形统计图样式 // 环形统计图样式
series: [ series: [
{ {
bottom:68, // bottom:68,
right:200, // right:200,
name: 'Access From', name: 'Access From',
type: 'pie', type: 'pie',
radius: ['90%', '55%'], radius: ['90%', '55%'],
@ -45,13 +52,7 @@ Component({
show: false show: false
}, },
// 环形数据 // 环形数据
data: [ data: datas
{ value: 1650245, name: '女性' },
{ value: 1650245, name: '未知' },
{ value: 3307418, name: '男性' },
]
} }
] ]
} }

@ -1,18 +1,27 @@
<view> <view>
<!-- 时间组件 --> <!-- 时间组件 -->
<time-component></time-component> <time-component></time-component>
<view class="brand"> <view class="brand">
<view class="text">性别</view>
<c-echars showChart="{{showChart}}" canvasId="modelbar-canvas" chartId="modelbar" chartOption="{{sexOption}}" height="100%"></c-echars> <c-echars showChart="{{showChart}}" canvasId="modelbar-canvas" chartId="modelbar" chartOption="{{sexOption}}" height="100%"></c-echars>
<view class="text">性别</view>
<view class="statistical">
<view class="annotation">
</view>
<view>123</view>
</view>
</view> </view>
<view class="brand"> <view class="brand">
<view class="text">认证</view> <view class="text">认证</view>
</view> </view>
<view class="brand"> <view class="brand">
<view class="text">地区</view> <view class="text">地区</view>
</view> </view>
</view> </view>

@ -1,10 +1,11 @@
/* 品牌传播声量 */ /* 用户画像 */
.brand{ .brand{
width: 686; width: 686;
height: 484rpx; height: 484rpx;
background-color: #fff; background-color: #fff;
margin: 32rpx; margin: 32rpx;
border-radius: 4rpx; border-radius: 4rpx;
/* display: flex; */
} }
.brand_tu{ .brand_tu{
width: 100%; width: 100%;
@ -13,4 +14,16 @@
.text{ .text{
font-size: 36rpx; font-size: 36rpx;
padding: 32rpx; padding: 32rpx;
font-weight: 400;
}
/* 统计图样式 */
.statistical{
width: 100%;
height:368;
padding: 36rpx;
display: flex;
}
.annotation{
width: 380;
height: 310;
} }
Loading…
Cancel
Save