highcharts中的环形图
环形图如下效果:

代码:
that.options = {
chart: {
type: 'pie',
backgroundColor: 'transparent',
color: '#fff',
// height: that.torem(500)
},
title: {
text: null
},
subtitle: {
text: null
},
plotOptions: {
pie: {
colors: ['#dba630', '#46ebce', '#b43cfc', '#3b7af8', '#29b00f'],
borderColor: 'transparent',
dataLabels: {
// 环形图内部展示
enabled: false
},
cursor: 'pointer',
showInLegend: true
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'middle',
padding: that.torem(80),
itemStyle: {
color: '#fff',
fontSize: that.torem(28)
},
itemDistance: that.torem(100),
lineHeight: that.torem(140),
labelFormatter: function() {
return `${this.name}\xa0\xa0\xa0${this.y}%`;
}
},
tooltip: {
headerFormat: '',
pointFormat: '<span style="color:{point.color}">\u25CF</span> <b> {point.name}:</b>' + '<b>{point.y}%</b>'
},
series: [
{
innerSize: '70%',
zMin: 0,
data: dataArr
}
]
};
highcharts中的环形图的更多相关文章
- Android中自定义环形图2
如图: 自定义属性,在values文件夹下创建 attrs.xml <?xml version="1.0" encoding="utf-8"?> & ...
- Android中自定义环形图
如图: 自定义view package com.riverlet.ringview; import android.animation.ObjectAnimator; import android.c ...
- Qt编写自定义控件41-自定义环形图
一.前言 自定义环形图控件类似于自定义饼状图控件,也是提供一个饼图区域展示占比,其实核心都是根据自动计算到的百分比绘制饼图区域.当前环形图控件模仿的是echart中的环形图控件,提供双层环形图,有一层 ...
- HighCharts中的无主题的2D折线图
HighCharts中的无主题的2D折线图 1.设计源码 <!DOCTYPE html> <html> <head> <meta charset=" ...
- HighCharts中的Ajax请求的2D折线图
HighCharts中的Ajax请求的2D折线图 设计源码: <!DOCTYPE html> <html> <head> <meta charset=&quo ...
- Java 在Excel中添加分离型饼图、环形图
一.概述 Excel中可支持多种不同类型的图表,本文介绍如何绘制分离型饼图和环形图.其中,分离型饼图的绘制可分为整体分离型(即设置饼图分离程度)和局部分离(即设置点爆炸型值)两种情况.下面将以Java ...
- HighChartS cpu利用率动态图(Java版)
来源:http://www.cnblogs.com/haifg/p/3217699.html 最近项目需要监控服务器cpu的利用率,并做成动态图.在网上查找了一些资料,最终选择了HighChart ...
- HighCharts实现多数据折线图分列显示
HighCharts实现多数据折线图分列显示 BY ZYZ HighCharts是一个很好用的web端绘图插件,用起来很方便,它的官方支持很好.并且有中文API(不全然).画出来的图像也挺美丽的. 近 ...
- 数据输入——生成你需要的echart图(堆积柱状图、扇形图、嵌套环形图)
最近论文需要一些比较直观的图表, 发现echart做出来的图还是比较美观的,这里介绍如何修改数据生成你需要的echart图. 1.堆积柱状图: http://echarts.baidu.com/exa ...
- Highcharts 基本区域图;Highcharts 使用负数区域图;Highcharts 堆叠区域图;Highcharts 百分比堆叠区域图
Highcharts 基本区域图 配置 chart chart.type 配置项用于设定图表类型,默认为 "line",本章节我们使用 'area'. var chart = { ...
随机推荐
- git 批量删除本地分支及远程分支
git 批量删除本地分支及远程分支 一.批量删除本地分支 git branch |grep 'name' |xargs git branch -D 备注: name 为需要匹配的分支名称 二.批量删除 ...
- effective-python-14
effective python-Item 14 list.sort函数,比较容易用的是reverse,而其中还有个参数key,默认是NONE,此时排序是按照默认比较方法排序,比如数据按照大小,字符串 ...
- WebRTC 简单入门与实践
一.前言 WebRTC 技术已经广泛在各个行业及场景中被应用,但对多数开发者来说,实时音视频及相关技术却是比较不常接触到的. 做为一名 Web 开发者,WebRTC 这块的概念着实花了不少时间才搞明白 ...
- Angular 18+ 高级教程 – Component 组件 の Attribute Directives 属性型指令
介绍 指令就是没有模板的组件.除了模板其它的都有,比如 selector.inject.@Input.lifecycle 等等. 那既然都有完整的组件了,为什么还搞一个少掉模板的指令呢? 很简单啊,因 ...
- IIS Reverse Proxy 反向代理
前言 反向代理是这样的: 2 台 web server, A server, B server A server 是 public 的, 有 domain, 有 SSL (作为 B server 的代 ...
- 算法与数据结构——AVL树(平衡二叉搜索树)
AVL树 在"二叉搜索树"章节提到,在多次插入和删除操作后,二叉搜索树可能退化为链表.在这种情况下,所有操作的时间复杂度将从O(logn)劣化为O(n). 如下图,经过两次删除节点 ...
- Java——图片文件位于 bin 目录下,下载新图片会导致应用程序重启
当应用程序在运行时需要加载图片文件时,如果图片文件位于 bin 目录下,下载新图片会导致应用程序重启,这是因为 Java 应用程序在加载资源时通常会遵循以下机制: 类加载器: Java 应用程序使用类 ...
- XYD1006CSPS
T1 密钥 [关键结论,模拟,枚举] Description 给定两个长度为 \(n\) 的 \(01\) 序列 \(a\),\(b\),每个位置都有一个权值 \(c\), 每次操作可以将 \(a\) ...
- 墨天轮访谈 | 腾讯张铭:带你揭秘王者荣耀背后的游戏数据库 TcaplusDB
分享嘉宾:张铭 腾讯数据库专家工程师,TcaplusDB产品负责人 整理:墨天轮社区 导读 大家好,我是腾讯TcaplusDB的产品负责人张铭,TcaplusDB是专为游戏设计的分布式 NoSQL 数 ...
- iOS关于列表布局的几种实现方式小结
最近在项目开发中,遇到了常见的列表布局样式,功能的要求是最多六行,动态展示.当时想到的方案是,抽象出一个cell,初始化六个标签,动态的控制显示和隐藏,这样功能上没有问题,就是代码有些冗余.请教了身边 ...