|
|
|
|
@ -1,13 +1,35 @@
|
|
|
|
|
/*
|
|
|
|
|
* @Author: your name
|
|
|
|
|
* @Date: 2021-10-12 15:14:58
|
|
|
|
|
* @LastEditTime: 2021-10-12 16:03:56
|
|
|
|
|
* @LastEditTime: 2021-10-26 12:47:13
|
|
|
|
|
* @LastEditors: Please set LastEditors
|
|
|
|
|
* @Description: In User Settings Edit
|
|
|
|
|
* @FilePath: /data-show/src/views/BrandInsight/weiboPortraits/opt.js
|
|
|
|
|
*/
|
|
|
|
|
import * as echarts from "echarts";
|
|
|
|
|
export default function createOpt() {
|
|
|
|
|
function createData(ds=[], colors=[]) {
|
|
|
|
|
let arr = [];
|
|
|
|
|
for(let i = 0; i < ds.length; i++) {
|
|
|
|
|
let ele = ds[i];
|
|
|
|
|
if(ele.value*1 > 0) {
|
|
|
|
|
let obj = { value: ele.value*1, name: ele.key, itemStyle: {
|
|
|
|
|
color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
|
|
|
|
|
//给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
|
|
|
|
|
//给第一个设置0，第四个设置1，就是垂直渐变
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: 'black'
|
|
|
|
|
}, {
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: colors[i]
|
|
|
|
|
}])
|
|
|
|
|
}};
|
|
|
|
|
arr.push(obj)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
return arr;
|
|
|
|
|
}
|
|
|
|
|
export default function createOpt(ds=[], colors=[]) {
|
|
|
|
|
const data = createData(ds,colors)
|
|
|
|
|
return {
|
|
|
|
|
series: [
|
|
|
|
|
{
|
|
|
|
|
@ -18,52 +40,23 @@ export default function createOpt() {
|
|
|
|
|
label: {
|
|
|
|
|
show: false,
|
|
|
|
|
position: 'center',
|
|
|
|
|
fontSize: '40',
|
|
|
|
|
color: "#ffff",
|
|
|
|
|
lineHeight: 48
|
|
|
|
|
},
|
|
|
|
|
emphasis: {
|
|
|
|
|
label: {
|
|
|
|
|
show: true,
|
|
|
|
|
fontSize: '40',
|
|
|
|
|
fontSize: '30',
|
|
|
|
|
color: "#ffff",
|
|
|
|
|
formatter: (p)=>{
|
|
|
|
|
return p.data.name + '\n' + p.data.value;
|
|
|
|
|
},
|
|
|
|
|
formatter: function (p) {
|
|
|
|
|
return `${p.data.name}\n${p.percent}%\n${p.data.value}`
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
labelLine: {
|
|
|
|
|
show: false
|
|
|
|
|
},
|
|
|
|
|
data: [
|
|
|
|
|
{ value: 2200, name: '男性', itemStyle: {color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
|
|
|
|
|
//给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
|
|
|
|
|
//给第一个设置0，第四个设置1，就是垂直渐变
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: 'black'
|
|
|
|
|
}, {
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: '#3373CC'
|
|
|
|
|
}])} },
|
|
|
|
|
{ value: 2200, name: '女性', itemStyle: {color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
|
|
|
|
|
//给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
|
|
|
|
|
//给第一个设置0，第四个设置1，就是垂直渐变
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: 'black'
|
|
|
|
|
}, {
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: '#CC9D12'
|
|
|
|
|
}])} },
|
|
|
|
|
{ value: 2200, name: '未知', itemStyle: {color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
|
|
|
|
|
//给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
|
|
|
|
|
//给第一个设置0，第四个设置1，就是垂直渐变
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: 'black'
|
|
|
|
|
}, {
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: '#54BF93'
|
|
|
|
|
}])} },
|
|
|
|
|
],
|
|
|
|
|
|
|
|
|
|
data: data
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: 'Access From1',
|
|
|
|
|
@ -78,36 +71,7 @@ export default function createOpt() {
|
|
|
|
|
show: false
|
|
|
|
|
},
|
|
|
|
|
center: ['50%', '50%'],//边框位置
|
|
|
|
|
data: [
|
|
|
|
|
{ value: 2200, name: '男性', itemStyle: {color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
|
|
|
|
|
//给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
|
|
|
|
|
//给第一个设置0，第四个设置1，就是垂直渐变
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: 'black'
|
|
|
|
|
}, {
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: '#3373CC'
|
|
|
|
|
}])} },
|
|
|
|
|
{ value: 2200, name: '女性', itemStyle: {color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
|
|
|
|
|
//给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
|
|
|
|
|
//给第一个设置0，第四个设置1，就是垂直渐变
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: 'black'
|
|
|
|
|
}, {
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: '#CC9D12'
|
|
|
|
|
}])} },
|
|
|
|
|
{ value: 2200, name: '未知', itemStyle: {color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
|
|
|
|
|
//给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
|
|
|
|
|
//给第一个设置0，第四个设置1，就是垂直渐变
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: 'black'
|
|
|
|
|
}, {
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: '#54BF93'
|
|
|
|
|
}])} },
|
|
|
|
|
],
|
|
|
|
|
|
|
|
|
|
data: data
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
}
|
|
|
|
|
|
