zaibei_charts/test/bar/ChartBar41/index.js

import Chart from "../../../src/chart/bar/ChartBar41/ChartBar41";
const consoleWarn = window.console.warn;

let bar=new Chart(document.querySelector(".c1"),{});

let opt ={
    color: ['#01FF91', '#00FFF0', '#00DEFF', '#009BFF', '#014EFF', '#6200FF', '#E400FF', '#FF50EB', '#FF9600', '#FFFF00', '#FFFFFF'],
    bg: {
        backgroundColor: "#000000"
    },
    legend: {
        show: true,
        left: "70%",
        top: '6%',
        orient: 'horizontal',
        itemWidth: 8,
        itemHeight: 8,
        borderRadius: 0,
        textStyle: {
            fontSize: 14,
            color: "#ffffff",
            fontWeight: 'normal'
        },
    },
    yearNumStyle: {
        textStyle: {
            fontSize: 50,
            color: "#ffffff",
            left: "0%",
            top: "0%",
        },
        buttonStyle:{
            left: "10%",
            top: "0%",
            backgroundColor: "#FFFFFF",
            color: "#000000",
            width: 50,
            height: 25,
            fontSize: 22,
            textLeft:"10%",
            textTop: "0%",
            textColor: '#000000'
        },
        shape: {
            fontSize: 24,
            mouseControl:true,
            PArrControl: false
        },
        data: ["2001", "2002", "2003", "2004", "2005","2006", "2007","2008","2009","2010",
        "2011","2012","2013","2014","2015","2016","2017","2018","2019","2020"],
        // cat: ['GDP', 'GDP第一产业','GDP第二产业','GDP第二产业:工业','GDP第二产业:建筑业',
        // 'GDP第三产业','人均GDP','GDP:第三产业:批发和零食业','GDP:第三产业:住宿和餐饮业',
        // 'GDP:第三产业:房地产业','GNI']
    },
    series: [
        {
            name: "GDP",
            data: [93007, 54867, 5782, 220333, 15084, 13048, 55507, 19804, 15670, 33303, 94056,77098,13302,54066,2233,5569,6549,11325,23587,2256]
        },
        {
            name: "GDP第一产业",
            data: [9544, 7557, 442, 5554, 545, 8359, 4457, 1144, 589,15514, 12238, 56657, 8784, 1567, 3335, 8456,79898,1132,5446, 14578]
        },
        {
            name: "GDP第二产业",
            data: [18563, 77404, 45405, 74704, 95854, 5656, 56570, 5544, 15667, 65406,15514, 12248, 56507, 79804, 15667, 3335, 8456,7798,12132,5446]
        },
        {
            name: "GDP第二产业:工业",
            data: [15618, 5467, 4582, 22133, 15514, 12248,15814, 12238, 5557, 8984, 15667, 3335, 8456,7998,13232,5466, 5557, 8794, 15667, 3335]
        },
        {
            name: "GDP第二产业:建筑业",
            data: [2498, 7577, 15854, 120248, 5667, 8784, 15667, 13335, 8456,7998,131302,50446, 55404, 5465, 83609, 4547, 11144, 4589, 4458, 3254]
        },
        {
            name: "GDP第三产业",
            data: [15514, 12238, 5667, 8794, 15667, 3335, 8456,7998,13232,5646,14145, 7744, 4645, 7474, 1584, 5667, 5544, 15667, 6546, 7416]
        },
        {
            name: "人均GDP",
            data: [3309, 5487, 15782, 22333, 15814, 1228, 15814, 12238, 5657, 8794, 15667, 3335, 8946,7798,13232,5466,5657, 8794, 15667, 9456]
        },
        {
            name: "GDP:第三产业:批发和零食业",
            data: [4554, 7577, 5544, 5465, 3569, 4547, 11144, 4589, 24578, 32441,2348, 5557, 8784, 15607, 3335, 8956,7798,13302,5446,6557]
        },
        {
            name: "GDP:第三产业:住宿和餐饮业",
            data: [3141, 7774, 4545, 7474, 15814, 5656, 5557, 5544, 15667,22348, 9557, 8784, 1567, 33135, 8956,7998,13232,5466,5657, 6546]
        },
        {
            name: "GDP:第三产业:房地产业",
            data: [39509, 14867, 45782, 22333, 15814, 12238, 56557, 8794, 15667,12248, 26657, 8784, 33335, 18456,79798,13132,5446,5557, 13335, 8946]
        },
        {
            name: "GNI",
            data: [54554, 75757, 4242, 55544, 5465,12248, 56657, 87004, 15667, 33335, 8956,7998,13232,54406,56657, 23569, 45457, 11144, 45809, 44578]
        }
    ]
};
let opt2 ={
    color: ['#01FF91', '#00FFF0', '#00DEFF', '#009BFF', '#014EFF', '#6200FF', '#E400FF', '#FF50EB', '#FF9600', '#FFFF00', '#FFFFFF'],
    bg: {
        backgroundColor: "#151D4D"
    },
    legend: {
        show: true,
        left: "70%",
        top: '6%',
        orient: 'horizontal',
        itemWidth: 8,
        itemHeight: 8,
        borderRadius: 0,
        textStyle: {
            fontSize: 14,
            color: "#ffffff",
            fontWeight: 'normal'
        },
    },
    yearNumStyle: {
        textStyle: {
            fontSize: 50,
            color: "#ffffff",
            left: "0%",
            top: "0%",
        },
        buttonStyle:{
            left: "10%",
            top: "0%",
            backgroundColor: "#FFFFFF",
            color: "#000000",
            width: 50,
            height: 25,
            fontSize: 22,
            textLeft:"10%",
            textTop: "0%",
            textColor: '#000000'
        },
        shape: {
            fontSize: 24,
            mouseControl:true,
            PArrControl: true
        },
        data: ["2001", "2002", "2003", "2004", "2005","2006", "2007","2008","2009","2010",
        "2011","2012","2013","2014","2015","2016","2017","2018","2019","2020"],
        // cat: ['GDP', 'GDP第一产业','GDP第二产业','GDP第二产业:工业','GDP第二产业:建筑业',
        // 'GDP第三产业','人均GDP','GDP:第三产业:批发和零食业','GDP:第三产业:住宿和餐饮业',
        // 'GDP:第三产业:房地产业','GNI']
    },
    series: [
        {
            name: "GDP",
            data: [93007, 54867, 5782, 220333, 15084, 13048, 55507, 19804, 15670, 33303, 94056,77098,13302,54066,2233,5569,6549,11325,23587,2256]
        },
        {
            name: "GDP第一产业",
            data: [9544, 7557, 442, 5554, 545, 8359, 4457, 1144, 589,15514, 12238, 56657, 8784, 1567, 3335, 8456,79898,1132,5446, 14578]
        },
        {
            name: "GDP第二产业",
            data: [18563, 77404, 45405, 74704, 95854, 5656, 56570, 5544, 15667, 65406,15514, 12248, 56507, 79804, 15667, 3335, 8456,7798,12132,5446]
        },
        {
            name: "GDP第二产业:工业",
            data: [15618, 5467, 4582, 22133, 15514, 12248,15814, 12238, 5557, 8984, 15667, 3335, 8456,7998,13232,5466, 5557, 8794, 15667, 3335]
        },
        {
            name: "GDP第二产业:建筑业",
            data: [2498, 7577, 15854, 120248, 5667, 8784, 15667, 13335, 8456,7998,131302,50446, 55404, 5465, 83609, 4547, 11144, 4589, 4458, 3254]
        },
        {
            name: "GDP第三产业",
            data: [15514, 12238, 5667, 8794, 15667, 3335, 8456,7998,13232,5646,14145, 7744, 4645, 7474, 1584, 5667, 5544, 15667, 6546, 7416]
        },
        {
            name: "人均GDP",
            data: [3309, 5487, 15782, 22333, 15814, 1228, 15814, 12238, 5657, 8794, 15667, 3335, 8946,7798,13232,5466,5657, 8794, 15667, 9456]
        },
        {
            name: "GDP:第三产业:批发和零食业",
            data: [4554, 7577, 5544, 5465, 3569, 4547, 11144, 4589, 24578, 32441,2348, 5557, 8784, 15607, 3335, 8956,7798,13302,5446,6557]
        },
        {
            name: "GDP:第三产业:住宿和餐饮业",
            data: [3141, 7774, 4545, 7474, 15814, 5656, 5557, 5544, 15667,22348, 9557, 8784, 1567, 33135, 8956,7998,13232,5466,5657, 6546]
        },
        {
            name: "GDP:第三产业:房地产业",
            data: [39509, 14867, 45782, 22333, 15814, 12238, 56557, 8794, 15667,12248, 26657, 8784, 33335, 18456,79798,13132,5446,5557, 13335, 8946]
        },
        {
            name: "GNI",
            data: [54554, 75757, 4242, 55544, 5465,12248, 56657, 87004, 15667, 33335, 8956,7998,13232,54406,56657, 23569, 45457, 11144, 45809, 44578]
        }
    ]
};
window.addEventListener("resize",function () {
    // console.log("???")
    bar.resize()
});

// setTimeout(()=>{
//     bar.setOption(opt);
// },3000)

// setTimeout(()=>{
//     bar.setOption(opt2);
// },6000)
// let p;
//
// setTimeout(()=>{
//     bar.setCameraPosition(p);
// },4000);