echarts 旭日图_sunburst图表

echarts 旭日图_sunburst图表echarts官网中的示例如下,我们只能看到一个visualMap的属性中加了inRange,便可以出来一个渐变色的图例但往往业务需求要的图例是这种格式的先贴一个实现的效果图,铛铛啷挡~~实现这个效果我们只需要操作viralMap的color属性和categories属性即可,如下:visualMap:{left:50,top:170,dimension:2,//orient:’horizontal’,

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

echarts官网中的示例如下,我们只能看到一个visualMap的属性中加了inRange,便可以出来一个渐变色的图例

echarts 旭日图_sunburst图表

但往往业务需求要的图例是这种格式的

echarts 旭日图_sunburst图表

先贴一个实现的效果图,铛铛啷挡~~

echarts 旭日图_sunburst图表实现这个效果我们只需要操作viralMap的color属性和 categories属性即可,如下:

visualMap: {
      left:50,      
      top:170,
      dimension: 2,
      // orient: 'horizontal',
      padding:5,
      textGap: 4,
      color: colors.reverse(),//colors是拿到的图例颜色数组,由于和name属性是反着的,所以一定要将 
                              数组reverse一下
      categories: ['Thinkpad','Ideapad','Success','Fail','Life cycle was on going','Life             
                   cycle was closed','No usage data','No IB data','Illegal LTB time','IB < 
                   usage','No_price_data','No warranty','IB data too less','NULL'
      ]//categories是每个颜色对应的名称
  },

这样,我们就可以实现自定义旭日图的图例了,这两组数据可以自己提取出来,当然也可以让后台的哥们返给你哈!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/189397.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • Idea激活码最新教程2023.1.3版本,永久有效激活码,亲测可用,记得收藏

    Idea激活码最新教程2023.1.3版本,永久有效激活码,亲测可用,记得收藏Idea 激活码教程永久有效 2023 1 3 激活码教程 Windows 版永久激活 持续更新 Idea 激活码 2023 1 3 成功激活

    2025年5月26日
    0
  • vue-router 基本使用「建议收藏」

    vue-router 基本使用「建议收藏」vue-router基本使用  路由,其实就是指向的意思,当我点击页面上的home按钮时,页面中就要显示home的内容,如果点击页面上的about按钮,页面中就要显示about的内容。Home按钮=>home内容,about按钮=>about内容,也可以说是一种映射.所以在页面上有两个部分,一个是点击部分,一个是点击之后,显示内容的部分。  点击之后,…

    2022年7月11日
    16
  • RSA加密算法Python实现

    RSA加密算法Python实现RSA加密算法Python实现RSA加密算法是目前使用最广泛的加密方式,具体流程见RSA加密算法之前想过用C语言实现,但是由于C语言对整型的位宽有要求,RSA加密算法中需要使用的数字大小远远超出C语言中longlongint的最大值,最近学习了Python之后,发现Python没有这一要求,可以较容易的实现。以下模拟中只能输入数字,因为实际过程中所有文字信息都被转化成Unicode数字码传输,代码中没有做转化这一步,只模拟算法。fromrandomimportrandintfromd

    2022年5月28日
    33
  • UART串口流控制(Flow control)「建议收藏」

    UART串口流控制(Flow control)「建议收藏」一般在串行通讯中,我们会在一些上位机上看到RTS/CTS、DTR/DSR和XON/XOFF的选项,这是对流控制的选项,一般是应用于RS232接口的,是拿来调制解调器的数据通讯的一、流控制的作用这里讲到的“流”,指的是数据流;在数据通信中,流控制是管理两个节点之间数据传输速率的过程,以防止出现接收端的数据缓冲区已满,而发送端依然继续发送数据,所导致数据丢失二、工作原理当接收端的数…

    2022年6月5日
    216
  • el-table自适应宽度_表格自适应大小

    el-table自适应宽度_表格自适应大小不要设置width=”110px”<el-table-columnprop=”login_id”align=”center”label=”工号”></el-table-column><el-table-columnprop=”login_id”width=”110px”align=”center”label=”工号…

    2022年9月7日
    0
  • html表单代码有哪些,HTML常用代码有哪些「建议收藏」

    html表单代码有哪些,HTML常用代码有哪些「建议收藏」HTML常用代码有哪些?网页的描述,关键字,作者及其他元素:metaname=””content=””客户端脚本:window.alert(”);文档的样式信息:引进图片:imgsrc换行:br超级链接:aherf新的页面打开:target=”_blank”无序列表:有序列表:表格的页眉:thead表格的主题:tbody定义表格的页脚:tfood定义表格:table边框:border单元…

    2022年8月11日
    6

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号