sws
/
carInsightSystem_wxapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

汽车销量

Browse Source
dev
wylyl22 3 years ago
parent 17a723cc0a
commit 0fa8d2f955
7 changed files with 101 additions and 451 deletions
Show Stats Download Patch File Download Diff File

235
components/indexCom/insightChild/index.js
Unescape View File

@ -1,7 +1,12 @@
Component({
data: {
showChart: true,
brandOption: {
tooltip: {
trigger: 'axis',
axisPointer: { // 坐标轴指示器，坐标轴触发有效
@ -11,13 +16,14 @@ Component({
},
legend: {
x:'15',
icon: 'rectangle',//data图标样式
itemWidth: 10,//data图标大小
itemHeight: 10,
textStyle: {
fontSize: 9
},
data: ['微博', '其他','短视频', '微信','APP', '论坛', '新闻'],
data: ['尾翼互动量'],
},
//图表位置
grid: {
@ -74,101 +80,15 @@ Component({
}
}
],
series: [
series:
{
name: '微博',
name: '尾翼互动量',
type: 'bar',
data: [1400, 2000, 1500, 1800, 1490, 900, 310],
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
itemStyle: {
normal:{
color: '#FF4852',
lineStyle: {
color: '#FF4852'
}
}
}
},
{
name: '其他',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [1520, 1052, 141, 174, 1690, 250, 220],
itemStyle: {
normal:{
color: '#FF6E25',
lineStyle: {
color: '#FF6E25'
}
}
}
},
{
name: '短视频',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [210, 322, 551, 364, 960, 1307, 10],
itemStyle: {
normal:{
color: '#FFBF00',
lineStyle: {
color: '#FFBF00'
}
}
}
},
{
name: '微信',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [250, 362, 71, 374, 970, 130, 170],
itemStyle: {
normal:{
color: '#20CC62',
lineStyle: {
color: '#20CC62'
}
}
}
},
{
name: 'APP',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [20, 32, 41, 354, 90, 130, 10],
itemStyle: {
normal:{
color: '#00D6D6',
lineStyle: {
color: '#00D6D6'
}
}
}
},
{
name: '论坛',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [200, 382, 661, 34, 909, 1308, 150],
itemStyle: {
normal:{
color: '#00AAFF',
@ -178,26 +98,10 @@ Component({
}
}
},
{
name: '新闻',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [250, 326, 178, 349, 900, 1300, 140],
itemStyle: {
normal:{
color: '#7257FF',
lineStyle: {
color: '#7257FF'
}
}
}
}
]
},
modelOption: {
modelOption: {
tooltip: {
trigger: 'axis',
axisPointer: { // 坐标轴指示器，坐标轴触发有效
@ -207,13 +111,14 @@ Component({
},
legend: {
x:'15',
icon: 'rectangle',//data图标样式
itemWidth: 10,//data图标大小
itemHeight: 10,
textStyle: {
fontSize: 9
},
data: ['微博', '其他','短视频', '微信','APP', '论坛', '新闻'],
data: ['尾翼互动量'],
},
//图表位置
grid: {
@ -253,6 +158,7 @@ Component({
],
xAxis: [
{
type: 'category',
data: ['大众速腾', '激励帝豪', '吉利星越', '奥迪A4', '奥迪Q5'],
axisTick:{
@ -270,67 +176,16 @@ Component({
}
}
],
series: [
series:
{
name: '微博',
name: '尾翼互动量',
type: 'bar',
data: [1400, 2000, 1500, 1800, 1490, 900, 310],
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
itemStyle: {
normal:{
color: '#FF4852',
lineStyle: {
color: '#FF4852'
}
}
}
},
{
name: '其他',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [1520, 1052, 141, 174, 1690, 250, 220],
itemStyle: {
normal:{
color: '#FF6E25',
lineStyle: {
color: '#FF6E25'
}
}
}
},
{
name: '短视频',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [210, 322, 551, 364, 960, 1307, 10],
itemStyle: {
normal:{
color: '#FFBF00',
lineStyle: {
color: '#FFBF00'
}
}
}
},
{
name: '微信',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [250, 362, 71, 374, 970, 130, 170],
itemStyle: {
normal:{
color: '#20CC62',
@ -340,58 +195,8 @@ Component({
}
}
},
{
name: 'APP',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [20, 32, 41, 354, 90, 130, 10],
itemStyle: {
normal:{
color: '#00D6D6',
lineStyle: {
color: '#00D6D6'
}
}
}
},
{
name: '论坛',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [200, 382, 661, 34, 909, 1308, 150],
itemStyle: {
normal:{
color: '#00AAFF',
lineStyle: {
color: '#00AAFF'
}
}
}
},
{
name: '新闻',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [250, 326, 178, 349, 900, 1300, 140],
itemStyle: {
normal:{
color: '#7257FF',
lineStyle: {
color: '#7257FF'
}
}
}
}
]
},
},

2
components/indexCom/insightChild/index.wxss
Unescape View File

@ -1,6 +1,6 @@
/* 品牌传播声量 */
.brand{
width: 100%;
width: 686rpx;
height: 484rpx;
background-color: #fff;
margin: 32rpx;

17
components/indexCom/portraitChild/index.wxml
Unescape View File

@ -2,16 +2,17 @@
<!-- 时间组件 -->
<time-component></time-component>
<view class="brand">
<view class="text">品牌传播声量</view>
<view class="brand_tu">
<c-echars showChart="{{showChart}}" canvasId="brandbar-canvas" chartId="brandbar" chartOption="{{brandOption}}" height="100%"></c-echars>
</view>
<view class="text">性别</view>
</view>
<view class="brand">
<view class="text">车型传播声量</view>
<view class="brand_tu">
<c-echars showChart="{{showChart}}" canvasId="modelbar-canvas" chartId="modelbar" chartOption="{{modelOption}}" height="100%"></c-echars>
</view>
<view class="text">认证</view>
</view>
<view class="brand">
<view class="text">地区</view>
</view>
</view>

235
components/indexCom/rankingChild/index.js
Unescape View File

@ -1,7 +1,12 @@
Component({
data: {
showChart: true,
brandOption: {
tooltip: {
trigger: 'axis',
axisPointer: { // 坐标轴指示器，坐标轴触发有效
@ -11,13 +16,14 @@ Component({
},
legend: {
x:'15',
icon: 'rectangle',//data图标样式
itemWidth: 10,//data图标大小
itemHeight: 10,
textStyle: {
fontSize: 9
},
data: ['微博', '其他','短视频', '微信','APP', '论坛', '新闻'],
data: ['尾翼互动量'],
},
//图表位置
grid: {
@ -74,101 +80,15 @@ Component({
}
}
],
series: [
series:
{
name: '微博',
name: '尾翼互动量',
type: 'bar',
data: [1400, 2000, 1500, 1800, 1490, 900, 310],
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
itemStyle: {
normal:{
color: '#FF4852',
lineStyle: {
color: '#FF4852'
}
}
}
},
{
name: '其他',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [1520, 1052, 141, 174, 1690, 250, 220],
itemStyle: {
normal:{
color: '#FF6E25',
lineStyle: {
color: '#FF6E25'
}
}
}
},
{
name: '短视频',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [210, 322, 551, 364, 960, 1307, 10],
itemStyle: {
normal:{
color: '#FFBF00',
lineStyle: {
color: '#FFBF00'
}
}
}
},
{
name: '微信',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [250, 362, 71, 374, 970, 130, 170],
itemStyle: {
normal:{
color: '#20CC62',
lineStyle: {
color: '#20CC62'
}
}
}
},
{
name: 'APP',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [20, 32, 41, 354, 90, 130, 10],
itemStyle: {
normal:{
color: '#00D6D6',
lineStyle: {
color: '#00D6D6'
}
}
}
},
{
name: '论坛',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [200, 382, 661, 34, 909, 1308, 150],
itemStyle: {
normal:{
color: '#00AAFF',
@ -178,26 +98,10 @@ Component({
}
}
},
{
name: '新闻',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [250, 326, 178, 349, 900, 1300, 140],
itemStyle: {
normal:{
color: '#7257FF',
lineStyle: {
color: '#7257FF'
}
}
}
}
]
},
modelOption: {
modelOption: {
tooltip: {
trigger: 'axis',
axisPointer: { // 坐标轴指示器，坐标轴触发有效
@ -207,13 +111,14 @@ Component({
},
legend: {
x:'15',
icon: 'rectangle',//data图标样式
itemWidth: 10,//data图标大小
itemHeight: 10,
textStyle: {
fontSize: 9
},
data: ['微博', '其他','短视频', '微信','APP', '论坛', '新闻'],
data: ['尾翼互动量'],
},
//图表位置
grid: {
@ -253,6 +158,7 @@ Component({
],
xAxis: [
{
type: 'category',
data: ['大众速腾', '激励帝豪', '吉利星越', '奥迪A4', '奥迪Q5'],
axisTick:{
@ -270,67 +176,16 @@ Component({
}
}
],
series: [
series:
{
name: '微博',
name: '尾翼互动量',
type: 'bar',
data: [1400, 2000, 1500, 1800, 1490, 900, 310],
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
itemStyle: {
normal:{
color: '#FF4852',
lineStyle: {
color: '#FF4852'
}
}
}
},
{
name: '其他',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [1520, 1052, 141, 174, 1690, 250, 220],
itemStyle: {
normal:{
color: '#FF6E25',
lineStyle: {
color: '#FF6E25'
}
}
}
},
{
name: '短视频',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [210, 322, 551, 364, 960, 1307, 10],
itemStyle: {
normal:{
color: '#FFBF00',
lineStyle: {
color: '#FFBF00'
}
}
}
},
{
name: '微信',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [250, 362, 71, 374, 970, 130, 170],
itemStyle: {
normal:{
color: '#20CC62',
@ -340,58 +195,8 @@ Component({
}
}
},
{
name: 'APP',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [20, 32, 41, 354, 90, 130, 10],
itemStyle: {
normal:{
color: '#00D6D6',
lineStyle: {
color: '#00D6D6'
}
}
}
},
{
name: '论坛',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [200, 382, 661, 34, 909, 1308, 150],
itemStyle: {
normal:{
color: '#00AAFF',
lineStyle: {
color: '#00AAFF'
}
}
}
},
{
name: '新闻',
type: 'bar',
stack:"Search Engine",
emphasis: {//折线图的高亮状态。
focus: "series",//聚焦当前高亮的数据所在的系列的所有图形。
},
data: [250, 326, 178, 349, 900, 1300, 140],
itemStyle: {
normal:{
color: '#7257FF',
lineStyle: {
color: '#7257FF'
}
}
}
}
]
},
},

28
components/indexCom/rankingChild/index.wxml
Unescape View File

@ -1,17 +1,27 @@
<view>
<!-- 时间组件 -->
<time-component></time-component>
<!-- 时间组件 -->
<time-component></time-component>
<view class="brand">
<view class="text">品牌传播声量</view>
<view class="brand_tu">
<c-echars showChart="{{showChart}}" canvasId="brandbar-canvas" chartId="brandbar" chartOption="{{brandOption}}" height="100%"></c-echars>
<view class="total">
<view class="content_left">
<view class="total_img">
<image style="width: 28rpx;height: 28rpx;" src="/images/car_sales.png"></image>
</view>
<view class="title">汽车销量排行</view>
</view>
<view class="content_left">
<view class="text1">查看详情</view>
<van-icon size="22px" name="arrow" style="color:#0084FF ;margin-left: 10rpx;" />
</view>
</view>
<view class="text">品牌销量排行</view>
</view>
<view class="brand">
<view class="text">车型传播声量</view>
<view class="brand_tu">
<c-echars showChart="{{showChart}}" canvasId="modelbar-canvas" chartId="modelbar" chartOption="{{modelOption}}" height="100%"></c-echars>
</view>
<view class="text">车型销量排行</view>
</view>
</view>

35
components/indexCom/rankingChild/index.wxss
Unescape View File

@ -1,10 +1,31 @@
/* 品牌传播声量 */
/* 热销排行 */
.total{
height: 80rpx;
line-height: 80rpx;
display: flex;
text-align: center;
justify-content: space-between;
/* margin: 0 32rpx; */
padding: 0 32rpx 0 32rpx;
background-color: #ebf5ff;
}
.content_left{
display: flex;
}
.total_img{
width: 64rpx;
height: 64rpx;
border-radius: 12rpx;
margin: 20rpx 20rpx 0 0rpx;
}
.brand{
width: 100%;
width: 686;
height: 484rpx;
background-color: #fff;
margin: 32rpx;
border-radius: 4rpx;
border-radius: 4rpx;
}
.brand_tu{
width: 100%;
@ -13,4 +34,12 @@
.text{
font-size: 36rpx;
padding: 32rpx;
}
.title{
font-size: 28rpx;
color: #0084FF;
}
.text1{
font-size: 24rpx;
color: #0084FF;
}

BIN
images/car_sales.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 778 B

Write Preview
Loading…
Cancel
Save