zaibei_charts/test/pie/ChartPie8/index.js

import ChartPie8 from '../../../src/chart/pie/ChartPie8/ChartPie8.js';
import title from "../../../src/chart/commonOptions/title";

let chart=new ChartPie8(document.getElementsByClassName('c1')[0],{});


window.addEventListener("resize",()=>{
	chart.resize();
});

const defaultOption = {
    color:['#6eebf4', '#51bbf4', '#44d7f5', '#42bdfd', '#768bff', '#0c70ee', '#74e9f2', '#778CFF', '#83b283', '#51C4E8', '#A1BEFF'],
    animation:{
        enterAnimate:{
            isAniamte: false,
            delayTime: 1000,
            duringTime: 3000,
            inDelayTime: 300,
            type: 'linear'
        }
	},
    legend: {
        show: true,
        left: "12%",
        top: '5%',
        orient: 'horizontal',
        itemAngelR: 3,
        padding: 1,
        itemWidth: 12,
        itemHeight: 8,
        borderRadius: 0,
        textStyle: {
            fontSize: 16,
            color: "#a9bcde"
        }
    },
    pie8: {
        center: {
            x:"50%",
            y:"55%"
        },
        is14:true,
        width:"80%",
        detailStyle:{
            fontWeight:'normal',
            color:'#ffffff',
            fontSize:18,
        },
        hoverColor:'#f8b500',//高亮颜色
        bgStyle:{
            outLineColor:'#3775BD', //外半圆线 #66a3ff
            innerLineColor:'#3775BD',//半径底线 #1d3a70
            outArcColor:'rgba(0,0,0,0)',//外扇形 #031023
            innerArcColor:'rgba(0,0,0,0)',//扇形#07162d
            arcBColor:'#135297',//内圈外线#1f325c
            arcBgColor:'#4696F2',//内圈内线#82b9d1
            directLineColor:'#fff',//高亮线条颜色
        }
    },
    series: [ 
        {
            "name": "基础信息网络",
            "value": 3
        },

        {
            "name": "医疗卫生",
            "value": 1
        },
        {
            "name": "重要互联网应用系统",
            "value": 9
        },
        {
            "name": "其他",
            "value": 0
        },
        {
            "name": "科研",
            "value": 8
        },
        {
            "name": "社会保障",
            "value": 0
        }
],
    bg:{
        backgroundColor:"#0b162f"
    },
};
setTimeout(()=>{
	console.log(555)
	chart.setOption(defaultOption)
},5000)
const opt2 = {
    color:['#6eebf4', '#51bbf4', '#44d7f5', '#42bdfd', '#768bff', '#0c70ee', '#74e9f2', '#778CFF', '#83b283', '#51C4E8', '#A1BEFF'],
    animation:{
        enterAnimate:{
            isAniamte: false,
            delayTime: 1000,
            duringTime: 3000,
            inDelayTime: 300,
            type: 'linear'
        }
	},
    legend: {
        show: true,
        left: "12%",
        top: '5%',
        orient: 'horizontal',
        itemAngelR: 3,
        padding: 1,
        itemWidth: 12,
        itemHeight: 8,
        borderRadius: 0,
        textStyle: {
            fontSize: 16,
            color: "#a9bcde"
        }
    },
    pie8: {
        center: {
            x:"50%",
            y:"55%"
        },
        is14:true,
        width:"80%",
        detailStyle:{
            fontWeight:'normal',
            color:'#ffffff',
            fontSize:18,
        },
        hoverColor:'#f8b500',//高亮颜色
        bgStyle:{
            outLineColor:'#3775BD', //外半圆线 #66a3ff
            innerLineColor:'#3775BD',//半径底线 #1d3a70
            outArcColor:'rgba(0,0,0,0)',//外扇形 #031023
            innerArcColor:'rgba(0,0,0,0)',//扇形#07162d
            arcBColor:'#135297',//内圈外线#1f325c
            arcBgColor:'#4696F2',//内圈内线#82b9d1
            directLineColor:'#fff',//高亮线条颜色
        }
    },
    series: [ 
        {
            "name": "基础信息网络",
            "value": 999
        },

        {
            "name": "医疗卫生",
            "value": 1
        },
        {
            "name": "重要互联网应用系统",
            "value": 9
        },
        {
            "name": "其他",
            "value": 2
        },
        {
            "name": "科研",
            "value": 0
        },
],
    bg:{
        backgroundColor:"#0b162f"
    },
};
// setTimeout(()=>{
// 	console.log(666)
// 	chart.setOption(opt2)
// },6000)
// setTimeout(()=>{
// 	chart.setOption( {
//         title: title.option(''),
//         color:['#a2a7ad', '#35abcd', '#166a96','#023854','#072c5d'],
//         pie8: {
//             center: {
//                 x:"50%",
//                 y:"50%"
//             },
//             width:"70%",
//             detailStyle:{
//                 fontWeight:'normal',
//                 color:'#ffffff',
//                 fontSize:14,
//             },
//         },
//         series: [{
//             name: ['数据一', '数据二', '数据三', '数据四'],
//             value: [9212, 7545, 6057,5482]
//         }],
//         bg:{
//             backgroundColor:"#0b162f"
//         },
//     });
// },3500);