mirror of
https://github.com/ialley-workshop-open/uni-halo.git
synced 2026-07-27 04:20:43 +08:00
小莫唐尼
3945ee611d
- 删除大量废弃的旧代码、依赖和配置文件 - 新增基础项目配置、工具函数、页面模板和请求库 - 重构目录结构，统一项目规范 - 添加commitlint、husky等代码规范工具
445 lines
8.1 KiB
JavaScript
445 lines
8.1 KiB
JavaScript
/*
|
||
* uCharts®
|
||
* 高性能跨平台图表库，支持H5、APP、小程序（微信/支付宝/百度/头条/QQ/360）、Vue、Taro等支持canvas的框架平台
|
||
* Copyright (c) 2021 QIUN®秋云 https://www.ucharts.cn All rights reserved.
|
||
* Licensed ( http://www.apache.org/licenses/LICENSE-2.0 )
|
||
* 复制使用请保留本段注释，感谢支持开源！
|
||
*
|
||
* uCharts®官方网站
|
||
* https://www.uCharts.cn
|
||
*
|
||
* 开源地址:
|
||
* https://gitee.com/uCharts/uCharts
|
||
*
|
||
* uni-app插件市场地址：
|
||
* http://ext.dcloud.net.cn/plugin?id=271
|
||
*
|
||
*/
|
||
|
||
// 通用配置项
|
||
|
||
// 主题颜色配置：如每个图表类型需要不同主题，请在对应图表类型上更改color属性
|
||
const color = [
|
||
'#1890FF',
|
||
'#91CB74',
|
||
'#FAC858',
|
||
'#EE6666',
|
||
'#73C0DE',
|
||
'#3CA272',
|
||
'#FC8452',
|
||
'#9A60B4',
|
||
'#ea7ccc',
|
||
]
|
||
|
||
const cfe = {
|
||
// demotype为自定义图表类型
|
||
type: [
|
||
'pie',
|
||
'ring',
|
||
'rose',
|
||
'funnel',
|
||
'line',
|
||
'column',
|
||
'area',
|
||
'radar',
|
||
'gauge',
|
||
'candle',
|
||
'demotype',
|
||
],
|
||
// 增加自定义图表类型，如果需要categories，请在这里加入您的图表类型例如最后的"demotype"
|
||
categories: ['line', 'column', 'area', 'radar', 'gauge', 'candle', 'demotype'],
|
||
// instance为实例变量承载属性，option为eopts承载属性，不要删除
|
||
instance: {},
|
||
option: {},
|
||
// 下面是自定义format配置，因除H5端外的其他端无法通过props传递函数，只能通过此属性对应下标的方式来替换
|
||
formatter: {
|
||
tooltipDemo1(res) {
|
||
let result = ''
|
||
for (const i in res) {
|
||
if (i == 0) {
|
||
result += `${res[i].axisValueLabel}年销售额`
|
||
}
|
||
let value = '--'
|
||
if (res[i].data !== null) {
|
||
value = res[i].data
|
||
}
|
||
// #ifdef H5
|
||
result += `\n${res[i].seriesName}：${value} 万元`
|
||
// #endif
|
||
|
||
// #ifdef APP-PLUS
|
||
result += `<br/>${res[i].marker}${res[i].seriesName}：${value} 万元`
|
||
// #endif
|
||
}
|
||
return result
|
||
},
|
||
legendFormat(name) {
|
||
return `自定义图例+${name}`
|
||
},
|
||
yAxisFormatDemo(value, index) {
|
||
return `${value}元`
|
||
},
|
||
seriesFormatDemo(res) {
|
||
return `${res.name}年${res.value}元`
|
||
},
|
||
},
|
||
// 这里演示了自定义您的图表类型的option，可以随意命名，之后在组件上 type="demotype" 后，组件会调用这个花括号里的option，如果组件上还存在eopts参数，会将demotype与eopts中option合并后渲染图表。
|
||
demotype: {
|
||
color,
|
||
// 在这里填写echarts的option即可
|
||
},
|
||
// 下面是自定义配置，请添加项目所需的通用配置
|
||
column: {
|
||
color,
|
||
title: {
|
||
text: '',
|
||
},
|
||
tooltip: {
|
||
trigger: 'axis',
|
||
},
|
||
grid: {
|
||
top: 30,
|
||
bottom: 50,
|
||
right: 15,
|
||
left: 40,
|
||
},
|
||
legend: {
|
||
bottom: 'left',
|
||
},
|
||
toolbox: {
|
||
show: false,
|
||
},
|
||
xAxis: {
|
||
type: 'category',
|
||
axisLabel: {
|
||
color: '#666666',
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: '#CCCCCC',
|
||
},
|
||
},
|
||
boundaryGap: true,
|
||
data: [],
|
||
},
|
||
yAxis: {
|
||
type: 'value',
|
||
axisTick: {
|
||
show: false,
|
||
},
|
||
axisLabel: {
|
||
color: '#666666',
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: '#CCCCCC',
|
||
},
|
||
},
|
||
},
|
||
seriesTemplate: {
|
||
name: '',
|
||
type: 'bar',
|
||
data: [],
|
||
barwidth: 20,
|
||
label: {
|
||
show: true,
|
||
color: '#666666',
|
||
position: 'top',
|
||
},
|
||
},
|
||
},
|
||
line: {
|
||
color,
|
||
title: {
|
||
text: '',
|
||
},
|
||
tooltip: {
|
||
trigger: 'axis',
|
||
},
|
||
grid: {
|
||
top: 30,
|
||
bottom: 50,
|
||
right: 15,
|
||
left: 40,
|
||
},
|
||
legend: {
|
||
bottom: 'left',
|
||
},
|
||
toolbox: {
|
||
show: false,
|
||
},
|
||
xAxis: {
|
||
type: 'category',
|
||
axisLabel: {
|
||
color: '#666666',
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: '#CCCCCC',
|
||
},
|
||
},
|
||
boundaryGap: true,
|
||
data: [],
|
||
},
|
||
yAxis: {
|
||
type: 'value',
|
||
axisTick: {
|
||
show: false,
|
||
},
|
||
axisLabel: {
|
||
color: '#666666',
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: '#CCCCCC',
|
||
},
|
||
},
|
||
},
|
||
seriesTemplate: {
|
||
name: '',
|
||
type: 'line',
|
||
data: [],
|
||
barwidth: 20,
|
||
label: {
|
||
show: true,
|
||
color: '#666666',
|
||
position: 'top',
|
||
},
|
||
},
|
||
},
|
||
area: {
|
||
color,
|
||
title: {
|
||
text: '',
|
||
},
|
||
tooltip: {
|
||
trigger: 'axis',
|
||
},
|
||
grid: {
|
||
top: 30,
|
||
bottom: 50,
|
||
right: 15,
|
||
left: 40,
|
||
},
|
||
legend: {
|
||
bottom: 'left',
|
||
},
|
||
toolbox: {
|
||
show: false,
|
||
},
|
||
xAxis: {
|
||
type: 'category',
|
||
axisLabel: {
|
||
color: '#666666',
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: '#CCCCCC',
|
||
},
|
||
},
|
||
boundaryGap: true,
|
||
data: [],
|
||
},
|
||
yAxis: {
|
||
type: 'value',
|
||
axisTick: {
|
||
show: false,
|
||
},
|
||
axisLabel: {
|
||
color: '#666666',
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: '#CCCCCC',
|
||
},
|
||
},
|
||
},
|
||
seriesTemplate: {
|
||
name: '',
|
||
type: 'line',
|
||
data: [],
|
||
areaStyle: {},
|
||
label: {
|
||
show: true,
|
||
color: '#666666',
|
||
position: 'top',
|
||
},
|
||
},
|
||
},
|
||
pie: {
|
||
color,
|
||
title: {
|
||
text: '',
|
||
},
|
||
tooltip: {
|
||
trigger: 'item',
|
||
},
|
||
grid: {
|
||
top: 40,
|
||
bottom: 30,
|
||
right: 15,
|
||
left: 15,
|
||
},
|
||
legend: {
|
||
bottom: 'left',
|
||
},
|
||
seriesTemplate: {
|
||
name: '',
|
||
type: 'pie',
|
||
data: [],
|
||
radius: '50%',
|
||
label: {
|
||
show: true,
|
||
color: '#666666',
|
||
position: 'top',
|
||
},
|
||
},
|
||
},
|
||
ring: {
|
||
color,
|
||
title: {
|
||
text: '',
|
||
},
|
||
tooltip: {
|
||
trigger: 'item',
|
||
},
|
||
grid: {
|
||
top: 40,
|
||
bottom: 30,
|
||
right: 15,
|
||
left: 15,
|
||
},
|
||
legend: {
|
||
bottom: 'left',
|
||
},
|
||
seriesTemplate: {
|
||
name: '',
|
||
type: 'pie',
|
||
data: [],
|
||
radius: ['40%', '70%'],
|
||
avoidLabelOverlap: false,
|
||
label: {
|
||
show: true,
|
||
color: '#666666',
|
||
position: 'top',
|
||
},
|
||
labelLine: {
|
||
show: true,
|
||
},
|
||
},
|
||
},
|
||
rose: {
|
||
color,
|
||
title: {
|
||
text: '',
|
||
},
|
||
tooltip: {
|
||
trigger: 'item',
|
||
},
|
||
legend: {
|
||
top: 'bottom',
|
||
},
|
||
seriesTemplate: {
|
||
name: '',
|
||
type: 'pie',
|
||
data: [],
|
||
radius: '55%',
|
||
center: ['50%', '50%'],
|
||
roseType: 'area',
|
||
},
|
||
},
|
||
funnel: {
|
||
color,
|
||
title: {
|
||
text: '',
|
||
},
|
||
tooltip: {
|
||
trigger: 'item',
|
||
formatter: '{b} : {c}%',
|
||
},
|
||
legend: {
|
||
top: 'bottom',
|
||
},
|
||
seriesTemplate: {
|
||
name: '',
|
||
type: 'funnel',
|
||
left: '10%',
|
||
top: 60,
|
||
bottom: 60,
|
||
width: '80%',
|
||
min: 0,
|
||
max: 100,
|
||
minSize: '0%',
|
||
maxSize: '100%',
|
||
sort: 'descending',
|
||
gap: 2,
|
||
label: {
|
||
show: true,
|
||
position: 'inside',
|
||
},
|
||
labelLine: {
|
||
length: 10,
|
||
lineStyle: {
|
||
width: 1,
|
||
type: 'solid',
|
||
},
|
||
},
|
||
itemStyle: {
|
||
bordercolor: '#fff',
|
||
borderwidth: 1,
|
||
},
|
||
emphasis: {
|
||
label: {
|
||
fontSize: 20,
|
||
},
|
||
},
|
||
data: [],
|
||
},
|
||
},
|
||
gauge: {
|
||
color,
|
||
tooltip: {
|
||
formatter: '{a} <br/>{b} : {c}%',
|
||
},
|
||
seriesTemplate: {
|
||
name: '业务指标',
|
||
type: 'gauge',
|
||
detail: { formatter: '{value}%' },
|
||
data: [{ value: 50, name: '完成率' }],
|
||
},
|
||
},
|
||
candle: {
|
||
xAxis: {
|
||
data: [],
|
||
},
|
||
yAxis: {},
|
||
color,
|
||
title: {
|
||
text: '',
|
||
},
|
||
dataZoom: [
|
||
{
|
||
type: 'inside',
|
||
xAxisIndex: [0, 1],
|
||
start: 10,
|
||
end: 100,
|
||
},
|
||
{
|
||
show: true,
|
||
xAxisIndex: [0, 1],
|
||
type: 'slider',
|
||
bottom: 10,
|
||
start: 10,
|
||
end: 100,
|
||
},
|
||
],
|
||
seriesTemplate: {
|
||
name: '',
|
||
type: 'k',
|
||
data: [],
|
||
},
|
||
},
|
||
}
|
||
|
||
export default cfe
|