import ChartBar from '../../../src/chart/zaibei/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 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(op1); }, 3000) setTimeout(() => { console.log(6000); // bar.setOption(op2); }, 6000) let op1 = { color: ['#0090ff'], bg: { backgroundColor: '#000713' }, title: Title.option('新经济普查工作'), grid: Grid.option, tooltip: ToolTip.option, legend: Legend.option, xAxis: { type: "category", data: ['地区一', '地区二asdasdasdasdasdasddasdas', '地区三', '地区四', '地区五', '地区六', '地区七', '地区八'], // dataPlus:[ // ['地一', '地二', '地三', '地三', '地五', '地六', '地七', '地七'], // ['正', '正', '正', '反', '反', '反', '正', '正'], // ], axisLine: { show: true, lineStyle: { color: '#224c69', width: 2, } }, axisTick: { show: true, alignWithLabel: true, interval: 'auto', length: 3, lineStyle: { color: '#ffff00' } }, axisLabel: { show: true, maxShow: '', overHidden: true, 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' }, label: { show: false, textStyle: { fontSize: 12, fontWeight: 'normal', color: '' //'' 表示使用series默认颜色数组 } }, }, series: [{ name: '行业总产值', type: 'bar', data: [91, 5, 82, 78, 74, 79, 67, 89] }] }; let op2 = { color: ['#0090ff'], bg: { backgroundColor: '#000713' }, title: Title.option('新经济普查工作'), grid: Grid.option, tooltip: {}, legend: Legend.option, xAxis: { type: "category", data: ['地区一', '地区二', '地区三', '地区四', '地区五', '地区六', '地区七', '地区八'], dataPlus: [ ['正', '正', '正', '反', '反', '反', '正', '正'] ], axisLine: { show: true, lineStyle: { color: '#224c69', width: 2, } }, axisTick: { show: true, alignWithLabel: true, interval: 'auto', length: 3, lineStyle: { color: '#ffff00' } }, axisLabel: { show: true, 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' }, label: { show: false, textStyle: { fontSize: 12, fontWeight: 'normal', color: '' //'' 表示使用series默认颜色数组 } }, }, series: [{ name: '行业总产值', type: 'bar', data: [91, 5, 82, 78, 74, 79, 67, 89] }] }