圆柱体

描述:当前是关于Echarts图表中的 柱状图 示例。
 
            var colors = ['#00FFFF', '#02FF67', '#675bba'];

option = {
   backgroundColor: '#081736',
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'shadow'
        }
    },
    grid: {
        top: '30%',
        right: '5%',
        left: '10%',
        bottom: '25%'
    },

    xAxis: [{
        type: 'category',
        axisLabel: {
            color: '#fff',
            interval:0
        },
        axisLine: {
            show: true,
            lineStyle: {
                color: '#0a3e98'
            }
        },
        axisTick: {
            show: false,
        },
        splitLine: {
            show: false,
            lineStyle: {
                color: '#195384',
                type: "dotted",
            }
        },
        data: ['缺劳动力','务工就业不稳','因病','因残','因学']
    }],
    yAxis: [
        {
            type: 'value',
            name: "人",
            min: 0,
            position: 'left',
            nameTextStyle: {
                color: "#fff",
                fontSize: 11,
            },
            axisLine: {
                lineStyle: {
                    color: '#0a3e98'
                }
            },
            axisTick: {
                show: false,
            },
            splitLine: {
                show: true,
                lineStyle: {
                    color: '#0a3e98',
                    type: "dotted",
                }
            },
            axisLabel: {
                formatter: '{value}',
                textStyle: {
                    color: "#fff",
                }
            },
        }
    ],
	
    series: [
		{
			name: "户数",
			type: 'pictorialBar',
			symbolSize: [15, 10],
			symbolOffset: [0, -6],
			symbolPosition: 'end',
			z: 12,
			// "barWidth": "0",
			label: {
				normal: {
					show: true,
					position: "top",
					// "formatter": "{c}%"
					fontSize: 12,
					color: '#34DCFF'
				}
			},
			tooltip:{
				show:false
			},
			color: "#1E65D0",
			data: ['8','4','25','16','2']
		},
		{
			name: '',
			type: 'pictorialBar',
			symbolSize: [15, 10],
			symbolOffset: [0, 6],
			// "barWidth": "20",
			z: 12,
			tooltip:{
				show:false
			},
			color: "#2F92CD",
			data: ['8','4','25','16','2']
		},
		{
			name:'户数',
			type: 'bar',
			//silent: true,
			barWidth: "15",
			barGap: '10%', // Make series be overlap
			barCateGoryGap: '10%',
			itemStyle: {
				normal: {
					color: new echarts.graphic.LinearGradient(0, 0, 0, 0.7, [{
							offset: 0,
							color: "#2E528E"
						},
						{
							offset: 1,
							color: "#22CCDB"
						}
					]),
					opacity: .8
				},
			},
			data: ['8','4','25','16','2']
		},
    ]
};