import ChartBar from '../../../src/chart/bar/ChartBar4/ChartBar4.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(() => { // bar.setOption(opt) }, 2000); setTimeout(() => { // bar.setOption(opt2) }, 4000); let opt = { color: ['#ff0000'], bg:{ backgroundColor:'#000713' }, title: Title.option('新经济普查工作'), grid:{ left:'18%', top:'20%', right:'18%', bottom:'18%', containLabel: false }, tooltip: Tooltip.option, legend: Legend.option, carousel: { show: false, showColumn: 3, r:20, color:'#ffff00', open: false }, 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, 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: '30%', label: { show: false, textStyle: { fontSize: 12, fontWeight: 'normal', color: '' //'' 表示使用series默认颜色数组 } } }, series: [ { name: '行业总产值', type: 'bar', data: [91,86,82,78,74,79,67,89] } ] }; let opt2 = { color: ['#ffff00'], bg:{ backgroundColor:'#000713' }, title: Title.option('新经济普查工作'), grid:{ left:'18%', top:'20%', right:'18%', bottom:'18%', containLabel: false }, tooltip: Tooltip.option, legend: Legend.option, carousel: { show: true, showColumn: 2, r:20, color:'#ffff00', open: false }, 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, 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: '30%', label: { show: false, textStyle: { fontSize: 12, fontWeight: 'normal', color: '' //'' 表示使用series默认颜色数组 } } }, series: [ { name: '行业总产值', type: 'bar', data: [91,86,82,78,74,79,67,89] } ] }; // bar.setOption( { // color: ['#02e4ff'], // bg:{ // backgroundColor:'#000713' // }, // title: Title.option('新经济普查工作'), // grid: Grid.option, // tooltip: {}, // legend: Legend.option, // 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, // 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: '30%', // label: { // show: false, // textStyle: { // fontSize: 12, // fontWeight: 'normal', // color: '' // //'' 表示使用series默认颜色数组 // } // }, // }, // series: [ // { // name: '行业总产值', // type: 'bar', // data: [91,86,82,78,74,79,67] // } // ] // })