zaibei_charts/test/bar/ChartBar5/index.js

import ChartBar from '../../../src/chart/bar/ChartBar5/ChartBar5.js';
import Title from "../../../src/chart/commonOptions/title";
import Grid from "../../../src/chart/commonOptions/grid";
import Legend from "../../../src/chart/commonOptions/legend";
import Tooltip from "../../../src/chart/commonOptions/tooltip";
import Animation from "../../../src/chart/commonOptions/animation";
import Carousel from "../../../src/chart/commonOptions/carousel";
// import Title from "../../../src/chart/commonOptions/title";
// import Grid from "../../../src/chart/commonOptions/grid";

let bar = new ChartBar(document.getElementsByClassName('c1')[0], {});
window.addEventListener('resize', () => {
    bar.resize();
});
setTimeout(()=>{
    // console.log(3000);
    bar.setOption(option);
},3000)
setTimeout(()=>{
    console.log(6000);
    // bar.setOption(op2);
},6000)


let option = {
    color: ['#02e4ff'],
    bg:{
        backgroundColor:'#000713'
    },
    // title: Title.option('新经济普查工作'),
    animation: Animation.option,
    grid: {
        left:'18%',
        top:'20%',
        right:'18%',
        bottom:'18%',
        containLabel: false
    },
    tooltip: Tooltip.option,
    carousel: Carousel.option,
    legend: {show:true,top:'5%'},
    xAxis: {
        type: "category",
        data: ['地区一', '地区二', '地区三', '地区四', '地区五', '地区六'],
        axisLine: {
            show: true,
            lineStyle: {
                color: '#224c69',
                width: 2,
            }
        },
        axisTick: {
            show: true,
            alignWithLabel: true,
            interval: 'auto',
            length:3,
            lineStyle: {
                color: '#ffff00'
            }
        },

        axisLabel: {
            show: true,
            overHidden: false,
            maxShow:'',
            textStyle:{
                color:'#54b3ea'
            }
//      	margin: 0,
        },
        // splitLine: {
        //     show: false,
        //     lineStyle: {
        //         color: '#26426a',
        //         width: 1,
        //
        //     }
        // }

    },
    yAxis: {
        type: 'value',
        title:'(%)',
        nameTextStyle:{
          color:'#54b3ea'
        },
        axisLine: {
            show: true,
            lineStyle: {
                color: '#224c69',
                width: 2,
                type: 'solid'
            }
        },
        splitLine: {
            show: false,
            lineStyle: {
                color: '#26426a',
                width: 1,
                type: 'solid'
            }
        },
        axisTick: {
            show: true,
            interval: 'auto',
            length:3,
            lineStyle: {
                color: '#ffff00',
            }
        },
        axisLabel: {
            show: true,
            textStyle:{
                color:'#54b3ea'
            }
//      	margin: 0,
        },

    },
    shape:{
        barCategoryGap: '40%',
            bgRect:{
              lineColor:'#02434b',
              color: '#021427',
            },
            rect:{
                hoverColor: '#ffd802'
            },
            label: {
                show: false,
                textStyle: {
                    fontSize: 12,
                    fontWeight: 'normal',
                    color: ''

                    //'' 表示使用series默认颜色数组
                }
            },
    },
    series: [
        {
            name: '行业总产值',
            type: 'bar',
            
            data: [91,5,82,78,74,79]
        }
    ]
};