zaibei_charts/test/bar/ChartBar44/index.js

import ChartBar from '../../../src/chart/bar/ChartBar44/ChartBar44';
import Title from "../../../src/chart/commonOptions/title";
import Grid from "../../../src/chart/commonOptions/grid";
import Legend from "../../../src/chart/commonOptions/legend";
import Animation from "../../../src/chart/commonOptions/animation";

let bar = new ChartBar(document.getElementsByClassName('c1')[0], {});
window.addEventListener('resize', () => {
    bar.resize();
});
setTimeout(()=>{
    // bar.setOption(opt);
},5000)

let opt = {
    color: ["#ff0000", "#66ffff"],
    bg: {
        backgroundColor: '#161729'
    },
    grid:  {
        left:'12%',
        top:'15%',
        right:'0%',
        bottom:'18%',
        containLabel: false
    },
    animation: Animation.option,
    tooltip: {
		bgStyle: {
		    backgroundColor: '#ffff00',
			bgbor:"#ff7e00"
		},
		angleR: 0,
		dangerline: {
		    show: false,
		    dangerData: 2560000,
		    color: '#f5196a'
		},
		tooltipText:{
			titleStyle:{
				fontSize:12
			},
			contentStyle:{
				fontSize:14
			},
		},
		titleColor:'#ffffff',
		contentColor:'#ffffff',
		titShowtxt:"分布数量"
	},
    legend: {
		show:false,
        left: "45%",
        top: '6%',
        itemHeight: 12,
        itemWidth: 12,
        itemAngelR: 20,
        textStyle: {
            fontSize: 16,
            color: '#50a7bd'
        }
    },
    xAxis: {
        type: "category",
        name: '年份',
        nameTextStyle: {
            fontSize: 12,
            color: '#cccccc',
        },
        namePosition: 'end',
        axisLine: {
            show: true,
            lineStyle: {
                color: 'rgba(90,142,207,0.4)',
                width: 1,
                type: 'solid'
            }
        },
        axisTick: {
            show: true,
            alignWithLabel: true,
			lineStyle: {
			    color: '#fff',
			    width: 1
			},
			length: 1
        },
        splitLine: {
            show: false,
        },
        axisLabel: {
            show: true,
            textStyle: {
                color: '#92a3c2'
            }
        },
        highLightColor: '#005eb8',
        data: [2008, 2009, 2010, 2011, 2012],
    },
    yAxis: {
        type: 'value',
        title: '',
        nameTextStyle: {
            color: '#66ffff',
            fontSize: 14
        },
        axisLine: {
            show: true,
            lineStyle: {
                color: 'rgba(90,142,207,0.4)',
                width: 1,
                type: 'solid'
            }
        },
        axisTick: {
            show: true,
            lineStyle: {
                color: '#fff',
                width: 1
            },
            length: 1,
            alignWithLabel: true
        },
        splitLine: {
            show: true,
			lineStyle: {
			    color: 'rgba(90,142,207,0.4)',
			    width: 1,
			    type: 'solid'
			}
        },
        axisLabel: {
            textStyle: {
                color: '#92a3c2'
            }
        },
    },
    shape:{
        barGap: '50%',
        barCategoryGap: '50%',
        label: {
            textStyle: {
                fontSize: 10,
                fontWeight: 'normal',
                color: '#fff'
            }
        },
        hoverColor: '#FF7E00',
    },
    series: [{
        name: '行业1',
        data: [91,84, 60, 40, 21]
    }

    ]

};