漏刻有时数据可视化Echarts组件开发(42)渐变色的应用

本文主要是介绍漏刻有时数据可视化Echarts组件开发(42)渐变色的应用,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

在这里插入图片描述

option = {backgroundColor: "#000",legend: {top: "0",itemWidth: 5,itemHeight: 5,textStyle: {color: "#FFFFFF",},icon: "circle",},grid: {left: "50px",top: "50px",right: "12px",bottom: "12px",containLabel: true,},xAxis: {type: "value",splitLine: {show: false,lineStyle: {color: "rgba(255,255,255,0.3)",},},axisTick: {show: false,},axisLine: {show: false,},axisLabel: {show: false,color: "#FFFFFF",},},yAxis: {type: "category",data: ["其他", "消防", "烟草", "农林", "交通", "教育", "文化", "卫生"],nameLocation: "end", // 轴名称相对位置valuenameTextStyle: {// 坐标轴名称样式color: "#fff",padding: [5, 0, 0, 5], // 坐标轴名称相对位置},nameGap: 200, // 坐标轴名称与轴线之间的距离axisLine: {show: false,lineStyle: {color: "rgba(255,255,255,0.3)",},},splitLine: {show: false,},axisTick: {show: false,},axisLabel: {margin: 15,color: "#03FFFB",},},color: ["#6046D1","#4B4CF9","#4C80E8","#4C80E8","#43A1FF","#59C8FF","#36BED9","#39DADA","#4CE8CE","#43FFC0","#9BFFAC","#DFFF94","#F3FFC6",],series: [{name: "南京",type: "bar",stack: "Tik Tok",barWidth: 6,itemStyle: {normal: {borderColor: "#00052C",borderWidth: 2,},},label: {normal: {show: true,position: "insideRight",offset: [-20, -12],formatter: "{c}",textStyle: {align: "center",baseline: "middle",fontSize: 12,fontWeight: "400",color: "#fff",},},},data: [220, 230, 250, 260, 280, 290, 300, 310],},{name: "无锡",type: "bar",stack: "Tik Tok",barWidth: 6,itemStyle: {normal: {borderColor: "#00052C",borderWidth: 2,},},label: {normal: {show: true,position: "insideRight",offset: [-20, -12],formatter: "{c}",textStyle: {align: "center",baseline: "middle",fontSize: 12,fontWeight: "400",color: "#fff",},},},data: [220, 230, 250, 260, 280, 290, 300, 310],},{name: "苏州",type: "bar",stack: "Tik Tok",barWidth: 6,itemStyle: {normal: {borderColor: "#00052C",borderWidth: 2,},},label: {normal: {show: true,position: "insideRight",offset: [-20, -12],formatter: "{c}",textStyle: {align: "center",baseline: "middle",fontSize: 12,fontWeight: "400",color: "#fff",},},},data: [220, 230, 250, 260, 280, 290, 300, 310],},{name: "常州",type: "bar",stack: "Tik Tok",barWidth: 6,itemStyle: {normal: {borderColor: "#00052C",borderWidth: 2,},},label: {normal: {show: true,position: "insideRight",offset: [-20, -12],formatter: "{c}",textStyle: {align: "center",baseline: "middle",fontSize: 12,fontWeight: "400",color: "#fff",},},},data: [220, 230, 250, 260, 280, 290, 300, 310],},{name: "镇江",type: "bar",stack: "Tik Tok",barWidth: 6,itemStyle: {normal: {borderColor: "#00052C",borderWidth: 2,},},label: {normal: {show: true,position: "insideRight",offset: [-20, -12],formatter: "{c}",textStyle: {align: "center",baseline: "middle",fontSize: 12,fontWeight: "400",color: "#fff",},},},data: [220, 230, 250, 260, 280, 290, 300, 310],},{name: "扬州",type: "bar",stack: "Tik Tok",barWidth: 6,itemStyle: {normal: {borderColor: "#00052C",borderWidth: 2,},},label: {normal: {show: true,position: "insideRight",offset: [-20, -12],formatter: "{c}",textStyle: {align: "center",baseline: "middle",fontSize: 12,fontWeight: "400",color: "#fff",},},},data: [220, 230, 250, 260, 280, 290, 300, 310],},{name: "泰州",type: "bar",stack: "Tik Tok",barWidth: 6,itemStyle: {normal: {borderColor: "#00052C",borderWidth: 2,},},label: {normal: {show: true,position: "insideRight",offset: [-20, -12],formatter: "{c}",textStyle: {align: "center",baseline: "middle",fontSize: 12,fontWeight: "400",color: "#fff",},},},data: [220, 230, 250, 260, 280, 290, 300, 310],},{name: "南通",type: "bar",stack: "Tik Tok",barWidth: 6,itemStyle: {normal: {borderColor: "#00052C",borderWidth: 2,},},label: {normal: {show: true,position: "insideRight",offset: [-20, -12],formatter: "{c}",textStyle: {align: "center",baseline: "middle",fontSize: 12,fontWeight: "400",color: "#fff",},},},data: [220, 230, 250, 260, 280, 290, 300, 310],},{name: "盐城",type: "bar",stack: "Tik Tok",barWidth: 6,itemStyle: {normal: {borderColor: "#00052C",borderWidth: 2,},},label: {normal: {show: true,position: "insideRight",offset: [-20, -12],formatter: "{c}",textStyle: {align: "center",baseline: "middle",fontSize: 12,fontWeight: "400",color: "#fff",},},},data: [220, 230, 250, 260, 280, 290, 300, 310],},{name: "淮安",type: "bar",stack: "Tik Tok",barWidth: 6,itemStyle: {normal: {borderColor: "#00052C",borderWidth: 2,},},label: {normal: {show: true,position: "insideRight",offset: [-20, -12],formatter: "{c}",textStyle: {align: "center",baseline: "middle",fontSize: 12,fontWeight: "400",color: "#fff",},},},data: [220, 230, 250, 260, 280, 290, 300, 310],},{name: "宿迁",type: "bar",stack: "Tik Tok",barWidth: 6,itemStyle: {normal: {borderColor: "#00052C",borderWidth: 2,},},label: {normal: {show: true,position: "insideRight",offset: [-20, -12],formatter: "{c}",textStyle: {align: "center",baseline: "middle",fontSize: 12,fontWeight: "400",color: "#fff",},},},data: [220, 230, 250, 260, 280, 290, 300, 310],},{name: "徐州",type: "bar",stack: "Tik Tok",barWidth: 6,itemStyle: {normal: {borderColor: "#00052C",borderWidth: 2,},},label: {normal: {show: true,position: "insideRight",offset: [-20, -12],formatter: "{c}",textStyle: {align: "center",baseline: "middle",fontSize: 12,fontWeight: "400",color: "#fff",},},},data: [220, 230, 250, 260, 280, 290, 300, 310],},{name: "连云港",type: "bar",stack: "Tik Tok",barWidth: 6,itemStyle: {normal: {borderColor: "#00052C",borderWidth: 2,},},label: {normal: {show: true,position: "insideRight",offset: [-20, -12],formatter: "{c}",textStyle: {align: "center",baseline: "middle",fontSize: 12,fontWeight: "400",color: "#fff",},},},data: [220, 230, 250, 260, 280, 290, 300, 310],},],
};

参见:makeAPie


@漏刻有时

这篇关于漏刻有时数据可视化Echarts组件开发(42)渐变色的应用的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/174283

相关文章

Android 悬浮窗开发示例((动态权限请求 | 前台服务和通知 | 悬浮窗创建 )

《Android悬浮窗开发示例((动态权限请求|前台服务和通知|悬浮窗创建)》本文介绍了Android悬浮窗的实现效果,包括动态权限请求、前台服务和通知的使用,悬浮窗权限需要动态申请并引导... 目录一、悬浮窗 动态权限请求1、动态请求权限2、悬浮窗权限说明3、检查动态权限4、申请动态权限5、权限设置完毕后

Redis的数据过期策略和数据淘汰策略

《Redis的数据过期策略和数据淘汰策略》本文主要介绍了Redis的数据过期策略和数据淘汰策略,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一... 目录一、数据过期策略1、惰性删除2、定期删除二、数据淘汰策略1、数据淘汰策略概念2、8种数据淘汰策略

轻松上手MYSQL之JSON函数实现高效数据查询与操作

《轻松上手MYSQL之JSON函数实现高效数据查询与操作》:本文主要介绍轻松上手MYSQL之JSON函数实现高效数据查询与操作的相关资料,MySQL提供了多个JSON函数,用于处理和查询JSON数... 目录一、jsON_EXTRACT 提取指定数据二、JSON_UNQUOTE 取消双引号三、JSON_KE

css渐变色背景|<gradient示例详解

《css渐变色背景|<gradient示例详解》CSS渐变是一种从一种颜色平滑过渡到另一种颜色的效果,可以作为元素的背景,它包括线性渐变、径向渐变和锥形渐变,本文介绍css渐变色背景|<gradien... 使用渐变色作为背景可以直接将渐China编程变色用作元素的背景,可以看做是一种特殊的背景图片。(是作为背

Python给Excel写入数据的四种方法小结

《Python给Excel写入数据的四种方法小结》本文主要介绍了Python给Excel写入数据的四种方法小结,包含openpyxl库、xlsxwriter库、pandas库和win32com库,具有... 目录1. 使用 openpyxl 库2. 使用 xlsxwriter 库3. 使用 pandas 库

SpringBoot定制JSON响应数据的实现

《SpringBoot定制JSON响应数据的实现》本文主要介绍了SpringBoot定制JSON响应数据的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们... 目录前言一、如何使用@jsonView这个注解?二、应用场景三、实战案例注解方式编程方式总结 前言

使用Python在Excel中创建和取消数据分组

《使用Python在Excel中创建和取消数据分组》Excel中的分组是一种通过添加层级结构将相邻行或列组织在一起的功能,当分组完成后,用户可以通过折叠或展开数据组来简化数据视图,这篇博客将介绍如何使... 目录引言使用工具python在Excel中创建行和列分组Python在Excel中创建嵌套分组Pyt

在Rust中要用Struct和Enum组织数据的原因解析

《在Rust中要用Struct和Enum组织数据的原因解析》在Rust中,Struct和Enum是组织数据的核心工具,Struct用于将相关字段封装为单一实体,便于管理和扩展,Enum用于明确定义所有... 目录为什么在Rust中要用Struct和Enum组织数据?一、使用struct组织数据:将相关字段绑

在Mysql环境下对数据进行增删改查的操作方法

《在Mysql环境下对数据进行增删改查的操作方法》本文介绍了在MySQL环境下对数据进行增删改查的基本操作,包括插入数据、修改数据、删除数据、数据查询(基本查询、连接查询、聚合函数查询、子查询)等,并... 目录一、插入数据:二、修改数据:三、删除数据:1、delete from 表名;2、truncate

基于Python开发PPTX压缩工具

《基于Python开发PPTX压缩工具》在日常办公中,PPT文件往往因为图片过大而导致文件体积过大,不便于传输和存储,所以本文将使用Python开发一个PPTX压缩工具,需要的可以了解下... 目录引言全部代码环境准备代码结构代码实现运行结果引言在日常办公中,PPT文件往往因为图片过大而导致文件体积过大,