option = {
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
series: [{undefined
//直接在data 数据修改
data: [120, 200, 150, 80, 70,
{
value:120,
itemStyle: {
color: 'blue',
}
},
130],
type: 'bar'
}]
};
有也可以通过series 下 label formatter修改 柱状图上的文字 如当数据为0时候设置为”“空对象 实现隐藏0数字
const barOption = () => ({
// title: {
// text: '重大活动供餐单位量化等级情况',
// right: 'auto',
// textStyle: {
// fontSize: 16
// }
// },
tooltip: {
trigger: 'axis',
axisPointer: {
// Use axis to trigger tooltip
type: 'shadow' // 'shadow' as default; can also be 'line' or 'shadow'
}
},
legend: {
// y: 'bottom',
itemHeight: 10,
itemWidth: 10,
right: 15,
textStyle: {
color: '#A3A9AF',
fontSize: 11
},
},
grid: {
top: '5%',
left: '2%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'value',
minInterval: 1,
axisTick: {
show: false
},
axisLabel: {
show: true,
textStyle: {
color: '#A3A9AF', // 更改坐标轴文字颜色
fontSize: 12 // 更改坐标轴文字大小
}
},
axisLine: {
lineStyle: {
color: '#f1f3f8'
}
},
// 坐标轴内线的样式
splitLine: {
lineStyle: {
color: '#f1f3f8'
// type:'dashed'虚线
}
},
}
],
yAxis: [
{
type: 'category',
axisLine: {
lineStyle: {
color: '#f1f3f8'
}
},
axisLabel: {
show: true,
textStyle: {
color: '#A3A9AF', // 更改坐标轴文字颜色
fontSize: 12 // 更改坐标轴文字大小
}
},
axisTick: {
alignWithLabel: true,
show: false
},
// data: ['outstanding', 'fine', 'normal']
}
],
// color: ['#3CCA00', '#F8A404', '#F4011E'],
series: [
{
name: '一般',
type: 'bar',
stack: 'total',
label: {
show: true,
formatter: params => {
if (params.value.normal == 0) {
return ''
}
}
},
emphasis: {
focus: 'series'
},
itemStyle: {
color: '#F4011E '
}
// data: [220, 182, 191, 234, 290, 330, 310]
},
{
name: '良好',
type: 'bar',
stack: 'total',
label: {
show: true,
// color: '#172533'
formatter: params => {
if (params.value.fine == 0) {
return ''
}
}
},
emphasis: {
focus: 'series'
},
// data: [120, 132, 101, 134, 90, 230, 210]
itemStyle: {
color: '#F8A404'
}
},
{
barWidth: '25',
name: '优秀',
type: 'bar',
stack: 'total',
label: {
show: showLable,
// color: '#172533'
formatter: params => {
if (params.value.outstanding == 0) {
return ''
}
}
},
emphasis: {
focus: 'series'
},
itemStyle: {
color: '#3CCA00'
}
// data: [320, 302, 301, 334, 390, 330, 320]
},
],
dataset: {
// 用 dimensions 指定了维度的顺序。直角坐标系中,
// 默认把第一个维度映射到 X 轴上,第二个维度映射到 Y 轴上。
// 如果不指定 dimensions,也可以通过指定 series.encode
// 完成映射,参见后文。
dimensions: ['deptName', 'normal', 'fine', 'outstanding'],
source: [
// { blackNum: 2, whiteNum: 3, product: "南山局" },
{ deptName: '福田局', outstanding: 0, fine: 0, normal: 0 },
{ deptName: '龙华局', outstanding: 2, fine: 85, normal: 20 },
{ deptName: '福田局2', outstanding: 20, fine: 4, normal: 4 },
{ deptName: '龙华局3', outstanding: 3, fine: 85, normal: 22 },
{ deptName: '福田局4', outstanding: 4, fine: 62, normal: 20 },
{ deptName: '龙华局5', outstanding: 5, fine: 85, normal: 22 },
{ deptName: '龙华1', outstanding: 6, fine: 85, normal: 22 },
// { deptName: '福田24', outstanding: 4, fine: 64, normal: 20 },
// { deptName: '龙华35', outstanding: 3, fine: 85, normal: 22 }
// { product: "白名单", "2015": 83.1, "2016": 73.4, "2017": 55.1 }
// { product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5 },
// { product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1 }
]
}
})
export {
barOption
}