echarts仪表盘不靠边的解决办法_echarts仪表盘边距_越来越好。的博客-程序员宅基地

技术标签: echarts可视化  

echarts仪表盘不靠边的解决办法

  • 仪表盘中,默认图表是水平垂直居中,如果要改外边距,用grid是不行的, 要用 center , center:['50%','50%'],第一个左,第二个上
  • 一个整圆,要加起来小于等于359.9度,如果整360度,则开始点和结束点会重合。
  •  series: [
                    {
                    name: '外层',
                    z:10,
                    type: 'gauge',
                    detail: {
                        formatter: function (){
                            return '当前时间';
                        },
                        fontSize:12 ,
                        offsetCenter:[0,'-47%'],
                        color:'#2d8bd5',
                    },
                    title:{
                        show:true,
                        fontSize:17,
                        offsetCenter:[0,'-32%'],
                        color:'#2d8bd5',
                        fontWeight :"bold",
                    },
                    radius:'88%',  //半径
                    center:['50%','50%'],  //边距
                    startAngle: '90',  //开始的度数,0 度
                    endAngle: '-269.99',    //结束的度数
                    min: 0,  
                    max: 12,
                    splitNumber: 12, //分为12份
                    data: [{
                        name:getNowFormatDate()
                    }],
                    axisLabel: { //刻度标签
                        distance: '12', //标签与刻度线的距离
                        textStyle: {
                            fontWeight: 'bold',
                            fontSize: 16,
                            color:'#2d8bd5'
                        },
                        formatter: function (t) {
                            switch (t + '') {   
                                default:
                                    return ''; 
                            }
                        }
                    },
                    axisLine:{
                        lineStyle:{
                            color:[ //整体为1,分成了12格,每个就是0.83
                                [0.1,"#339CCD"],
                                [0.1,"#16497A"],
                                [0.17,"#46A5E1"],
                                [0.23,"#16497A"],
                                [0.27,"#16497A"],
                                [0.34,"#46A5E1"],
                                [0.38,"#88CCEE"],
                                [0.4,"#46A5E1"],
                                [0.5,"#378FBF"],
                                [0.59,"#46A5E1"],
                                [0.7,"pink"],
                                [0.85,'pink'],
                                [0.92,"#D7E5E9"],
                                [0.97,"#46A5E1"],
                                [1,"#ff6000"],          
                            ],
                            width:18
                        }
                    },
                    axisTick: { //小刻度尺
                        show: false,
                    },
                    splitLine: {    //分割的刻度尺,大刻度尺
                        show: 0,
                    },
                    pointer:{
                        // length:"120%",
                        show:false
                    },
                    
                },
              ]

     

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/qq_38880700/article/details/99999206

智能推荐

SpringBoot项目中集成Quartz实现定时调度任务_springboot通过quartz实现定时调度-程序员宅基地

一、Quartz1、简介起初是OpenSymphony组织提供的一个功能丰富的开源作业调度框架官网:http://www.quartz-scheduler.org/纯java编写,用法简单而功能强大。2、特点强大的作业调度功能作为spring默认的调度框架,极易与spring无缝整合,实现灵活可配置的调度功能,quartz提供了调 度运行环境持久化机制,可以保存并恢复调度现场,即使系统因故障关闭也不会造成调度现场的数据丢失。灵活的应用方式允许我们灵活定义触发器的调度时间规则,并可以将_springboot通过quartz实现定时调度

阿里yum源的配置与本地yum源的配置_龙晰 公网源-程序员宅基地

yum简单来讲就是一个资源库yum是从国外的服务器上所以国内下载资源是非常耗时的,虽然阿里已将常用的一些资源封装到自己的服务器上供国人共享,但相对与本地下载还是时间较长的。本文将介绍两种yum的配置_龙晰 公网源

爬虫爬取猫眼电影top100排名并保存本地Excel或txt-程序员宅基地

import requests,refrom openpyxl.workbook import Workbookfrom openpyxl.writer.excel import ExcelWriterdef get_page(url): headers = { "User-Agent":"Mozilla/5.0 (Macintosh; U; Intel Mac OS X...

Scrapy实战篇(五)之爬取历史天气数据-程序员宅基地

  本篇文章我们以抓取历史天气数据为例,简单说明数据抓取的两种方式:  1、一般简单或者较小量的数据需求,我们以requests(selenum)+beautiful的方式抓取数据  2、当我们需要的数据量较多时,建议采用scrapy框架进行数据采集,scrapy框架采用异步方式发起请求,数据抓取效率极高。  下面我们以http://www.tianqihouba..._爬取历史天气数据的原因分析

重采样、下采样、上采样三者之间的关系-程序员宅基地

重采样主要是分为上采样和下采样,在进行采样的过程中,需要注意采样的倍率的问题,并不是可以随意的改变采样率的大小的,根据采样定理:在进行模拟/数字信号的转换过程中,当采样频率大于信号中最高频率的2倍时,采样之后的数字信号完整地保留了原始信号中的信息,一般实际应用中保证采样频率为信号是最高频率的5~10倍。采样定理又称奈奎斯特定理。采样频率:采样频率,也称为采样速度或者采样率,定义了每秒从连续信..._重采样

路由器漏洞复现分析第二弹:CNVD-2018-01084-程序员宅基地

1月17日,CNVD公开了D-LinkDIR 615/645/815 service.cgi远程命令执行漏洞(CNVD-2018-01084),freebuf上有前辈写了一篇漏洞复现和poc的文章(http://www.freebuf.com/new/160716.html)。在上一篇文章(http://www.freebuf.com/vuls/160040.html)里实际操作了一下用qem...

随便推点

使用第三方库找不到SO库UnsatisfiedLinkError错误原因及解决方案-程序员宅基地

以下大部分来自其他博客,谢谢! 在开发项目的时候我们免不了使用一些第三方的库来进行快速开发,有些第三方库只是简单的一个jar包,但是有些使用了jni开发,因此会包含so库文件,这个时候如果不消息我们就会遇到一个错误:java.lang.UnsatisfiedLinkError; 最近经常遇到有开发者在问使用环信sdk的时候出现这个错误;这里分享下问题原因以及解..._unsatisfiedlinkerror

程序猿光棍节闯关游戏-程序员宅基地

好无聊好寂寞,来玩一下。。。。因为我不是程序猿,所以应该闯不到头的。。。。边闯边写就是了 第一关链接请戳 http://segmentfault.com/game/ 第一关查看源代码即可 于是得到第二关链接http://segmentfault.com/game/?k=d677c833e6d6af85176dc8ff32158

微信收付通V3支付_古傲天的博客-程序员宅基地

<?phpnamespace app\common\lib\built;use app\platform\model\PaymentConfig;/** * 微信支付 * Class WxPayment * @package app\common\lib\built */class WxPayment{ protected $authorization = 'WECHATPAY2-SHA256-RSA2048'; //认证类型 protected $metho

暗黑3显示无效的服务器,《暗黑3》为啥爆不出好装备?服务器IP决定你的人品..._生活教会我们的博客-程序员宅基地

《暗黑3》为啥爆不出好装备?服务器IP决定你的人品2012-08-07 09:33:24来源:游戏下载编辑:末日使者评论(0)国外某著名D3论坛正在被国外玩家置顶讨论的话题:观点认为掉落与游戏房间所在服务器相关,即不同服务器之间的掉率不同。或许只是传言简单来讲,就是要避开掉率低的服务器,进入掉率高的服务器进行MF。操作方法是:当你建立房间后(指你选择了一个进度并进行游戏,不是在登录界面,也不是人物...

html输入提示框点击确认显示内容,前端 自定义确认提示框(二)_paxzone的博客-程序员宅基地

以上demo,完整案例请下载:example-MyconfirmDialog或者访问github地址:https://github.com/Kybs0/Kybs0HtmlCssJsDemo/tree/master/definedAlertWindow自定义动态确认框假如一个页面有多个业务需要确认框,上面的确认框就显得代码冗余了。下面提供一个确认框的组件:1. 定义弹出框的组件安装动画过渡组件Re..._手机端 html 确认对话框 自定义文字内容怎么设置

[转]Win32下两种用于C++的线程同步类-程序员宅基地

  线程同步是多线程程序设计的核心内容,它的目的是正确处理多线程并发时的各种问题,例如线程的等待、多个线程访问同一数据时的互斥,防死锁等。Win32提供多种内核对象和手段用于线程同步,如互斥量、信号量、事件、临界区等。所不同的是,互斥量、信号量、事件都是Windows的内核对象,当程序对这些对象进行控制时会自动转换到核心态,而临界区本身不是内核对象,它是工作在用户态的。我们知道从用户态转换到核心态是需要以时间为代价的,所以如果能在用户态就简单解决的问题,就可以不必劳烦核心态了。  这