echars3

来源：互联网发布：赤兔软件编辑：程序博客网时间：2024/05/29 21:35
echars3
修改背景
修改图例颜色
修改坐标轴颜色,文字颜色
修改折线颜色
切换折线图和柱形图
修改工具图标颜色，文字颜色
修改底部网格颜色
var billChar = echarts.init(document.getElementById('billCharbox'));            billoptions = {                color: ['#99ccff', '#ffcc00'],//4                backgroundColor: {                    type: 'linear',                    x: 0,                    y: 0,                    x2: 0,                    y2: 1,                    colorStops: [{                        offset: 0,                        color: '#0099ff' // 0% 处的颜色                    }, {                        offset: 1,                        color: '#0099ff' // 100% 处的颜色                    }],                    globalCoord: false // 缺省为 false                }//1                ,                tooltip: {                    trigger: 'axis'                },                legend: {                    data: ['2016年', '2017年'],                    textStyle: {                        color: "#fff"                    }//2                },                toolbox: {                    show: true,                    iconStyle: {                        normal: {                            borderColor: "#fff"//7.图标                        },                        emphasis: {                            color: "#fff"//7.文字                        }                    },//6                    feature: {                        dataView: {                            readOnly: false                        },                        magicType: {                            type: ['bar']//5                        },                        restore: {},                        saveAsImage: {}                    }                },                xAxis: {                    type: 'category',                    boundaryGap: false,                    axisLabel: {                        textStyle: {                            color: "#fff"                        }                    },//3                    axisLine: {                        lineStyle: {                            color: "#fff"                        }                    },//3                    data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']                },                yAxis: {                    type: 'value',                    axisLabel: {                        textStyle: {                            color: "#fff"                        }                    },                    axisLine: {                        lineStyle: {                            color: "#fff"                        }                    },                    axisLabel: {                        formatter: '{value} 元'                    },                    splitLine: {                        show: "true",                        lineStyle: {                            color: ['rgba(255,255,255,0.3)']                        }                    }//7                },                series: [{                    name: '2016年',                    type: 'line',                    data: [320, 332, 301, 334, 390, 330, 320, 321, 457, 578, 121, 454],                    markPoint: {                        data: [{                            type: 'max',                            name: '年大值'                        }, {                            type: 'min',                            name: '年小值'                        }]                    },                    markLine: {                        data: [{                            type: 'average',                            name: '平均值'                        }]                    }                }, {                    name: '2017年',                    type: 'line',                    data: [120, 132, 101, 134, 90, 230, 210, 120, 230, 89, 151, 121],                    markPoint: {                        data: [{                            type: 'max',                            name: '年大值'                        }, {                            type: 'min',                            name: '年小值'                        }]                    },                    markLine: {                        data: [{                                type: 'average',                                name: '平均值'                            },                        ]                    }                }]            };            billChar.setOption(billoptions);
0 0