Echarts仪盘表axisLine渐变及title颜色设置

简介: Echarts仪盘表axisLine渐变及title颜色设置

20200322103939805.png


option = {
    backgroundColor: '#1092f5',
    tooltip: {
        formatter: '{a} <br/>{b} : {c}%'
    },
    series: [{
        name: '业务指标',
        type: 'gauge',
        axisLabel: {
            color: '#fff'
        },
        axisLine: {
            show: true,
            lineStyle: {
                color: [
                    [1, new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                            offset: 0.1,
                            color: "#0bacff"
                        },
                        {
                            offset: 0.6,
                            color: "#2089cf"
                        },
                        {
                            offset: 1,
                            color: "#0169ec"
                        }
                    ])]
                ]
            }
        },
        splitLine: {
            lineStyle: {
                color: "#eee"
            }
        },
        detail: {
            color: '#fff',
            formatter: '{value}%',
        },
        title: { //设置仪表盘中间显示文字样式
            textStyle: { // 其余属性默认使用全局文本样式,详见TEXTSTYLE
                fontWeight: 'bolder',
                fontSize: 20,
                color: "white"
            }
        },
        data: [{
            value: 70,
            name: '完成率'
        }]
    }]
};
相关文章
|
22天前
echarts 横纵分割线颜色透明度
echarts 横纵分割线颜色透明度
echarts设置单位的偏移
echarts设置单位的偏移
|
22天前
|
数据可视化 前端开发 定位技术
echarts 关于折线统计图常用的属性设置--超详细(附加源码)
echarts 关于折线统计图常用的属性设置--超详细(附加源码)
28 0
|
22天前
Echarts图表设置x轴y轴均随滚轮滚动缩+放 区域缩放
Echarts图表设置x轴y轴均随滚轮滚动缩+放 区域缩放
|
22天前
|
JavaScript 数据可视化 前端开发
ECharts 的配置语法:配置选项、数据格式、样式设置
ECharts 的配置语法:配置选项、数据格式、样式设置
212 1
echarts设置多条折线不是你想的那样简单
echarts设置多条折线不是你想的那样简单
echarts去掉y轴线、设置x轴线的颜色、x轴文字颜色
echarts去掉y轴线、设置x轴线的颜色、x轴文字颜色
|
22天前
|
数据可视化
echarts图表坐标轴数据标签添加下划线
echarts图表坐标轴数据标签添加下划线
81 0
|
22天前
|
前端开发 JavaScript BI
Django教程第5章 | Web开发实战-数据统计图表(echarts、highchart)
使用echarts和highcharts图表库实现折线图、柱状图、饼图和数据集图
81 2
|
22天前
|
数据可视化 JavaScript 前端开发
Echarts是一个开源的JavaScript可视化库,用于创建各种类型的图表
Echarts是JavaScript的开源可视化库,Python通过Pyecharts库可调用它来绘制图表。示例展示了如何用Pyecharts创建柱状图:定义图表对象,设置标题和坐标轴,添加X轴、Y轴数据,最后渲染展示。Pyecharts还支持折线图、散点图、饼图等多种图表类型,更多详情可查阅官方文档。
37 0