echarts实现夜晚暗黑模式仪表盘图表效果代码-html代码-BFW代码库

echarts实现夜晚暗黑模式仪表盘图表效果代码

代码语言：html

所属分类：图表

代码描述：echarts实现夜晚暗黑模式仪表盘图表效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/echarts.js"></script>


</head>
<body>
    <div id="container" style="height:500px;width:700px">

    </div>
    <script type="text/javascript">
        var option = {
            backgroundColor: '#1b1b1b',
            tooltip: {
                formatter: '{a} <br/>{c} {b}'
            },
            toolbox: {
                show: true,
                feature: {
                    mark: {
                        show: true
                    },
                    restore: {
                        show: true
                    },
                    saveAsImage: {
                        show: true
                    }
                }
            },
            series: [{
                name: '速度',
                type: 'gauge',
                min: 0,
                max: 220,
                splitNumber: 11,
                radius: '50%',
                axisLine: {
                    // 坐标轴线
                    lineStyle: {
                        // 属性lineStyle控制线条样式
                        color: [[0.09,
                            'lime'],
                            [0.82,
                                '#1e90ff'],
                            [1,
                                '#ff4500']],
                        width: 3,
                        shadowColor: '#fff',
                        //默认透明
                        shadowBlur: 10
                    }
                },
                axisLabel: {
                    // 坐标轴小标记
                    fontWeight: 'bolder',
                    color: '#fff',
                    shadowColor: '#fff',
                    //默认透明
                    shadowBlur: 10
                },
                axisTick: {
                    // 坐标轴小标记
                    length: 15,
                    // 属性length控制线长
                    lineStyle: {
                        // 属性lineStyle控制线条样式
                        color: 'auto',
                        shadowColor: '#fff',
                        //默认透明
                        shadowBlur: 10
                    }
                },
                splitLine: {
                    // 分隔线
                    length: 25,
                    // 属性length控制线长
                    lineStyle: {
                        // 属性lineStyle（详见lineStyle）控制线条样式
                        width: 3,
                        color: '#fff',
             .........完整代码请登录后点击上方下载按钮下载查看