效果:

JSON加载数据:

var chartseries2 = [
{
name: '完成' + data.rate + '%',
y: data.rate
},
{
name: '未完成' + data.rateless + '%',
y: data.rateless
}];
chart2.series[].setData(chartseries2);

定义:

chart2 = new Highcharts.Chart({
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false,
renderTo: 'container2',
type: 'pie',
backgroundColor: 'rgba(0,0,0,0)' --设置背景色
},
title: {
text: ''
},
tooltip: {
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
},
colors: ['#00DD00', '#FF0000'],
plotOptions: {
pie: {
size: '100%',
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#FFFF00',
distance: -, --设置偏移,使文字显示在图形内
connectorColor: '#000000',
format: '<b>{point.name}</b>',
style: {
fontWeight: ,
fontSize: "25px"--设置文字大小
}
},
formatter: function (index) {
return '<span style="color:#00008B;font-weight:bold">' + this.point.name + '</span>';
},
showInLegend: true
}
},
series: [{
data: [
{
name: '完成80%',
y:
},
{
name: '未完成20%',
y:
}
]
}]
});

highcharts饼图的更多相关文章

  1. highCharts 饼图动态加载

    饼图的动态加载 (1):导入样式 <script type="text/javascript" src="<%=request.getContextPath( ...

  2. Highcharts 饼图 文字颜色设置

    设置饼图对应的提示文字的颜色与饼图块状一样,demo如下: $(function () { $('#container').highcharts({ chart: { plotBackgroundCo ...

  3. FusionCharts和highcharts 饼图区别!

    FusionCharts ---------------脚本--------------- <script src="../../../fashioncharts/js/FusionC ...

  4. HighCharts 饼图

    @{ ViewBag.Title = "Index"; Layout = "~/Views/Shared/_Layout.cshtml"; } @section ...

  5. highcharts 饼图显示数据比例如何保留二位小数

    var NewPerCent=parseFloat(NewPerCent.toString()).toFixed(2);return '<b>'+ this.point.name +'&l ...

  6. Highcharts 饼图数值显示在图形上

    1.引用js文件 <script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1 ...

  7. Highcharts之饼图

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  8. HighCharts 在IE8下饼图不显示的问题

    HighCharts饼图用来做数据统计时,在IE8下发现某些图形不能正确显示出来. 在IE8下面会报  'this.renderer.gradients' 为空或不是对象 这样的错误.. 解决方法: ...

  9. 【Highcharts】 绘制饼图和漏斗图

    1.outModel类设计 设计outModel类首先研究下Highcharts中series的data数据格式,发现饼图和漏斗图都可以使用这样格式的数据 series: [{ name: 'Uniq ...

随机推荐

  1. 在远程连接mysql数据库出现问题怎么办

    远程连接mysql数据库报“Communications link failure...”错误 今天在用myEclipse连接时提示:Communications link failure,Last ...

  2. IIS的部署(二)------虚拟目录的使用

    IIS的虚拟目录 一个站点的网页的存储位置目录是固定的,而且结构和物理保存网页的磁盘路径相同.例如:默认网页的存储位置是c:\inetpub\wwwroot,当访问localhost即访问c:\ine ...

  3. tarsgo初探

    参考:https://mp.weixin.qq.com/s/aO8ybUiu5htqcoGAwxwc5Q?utm_source=tuicool&utm_medium=referral 1.Go ...

  4. robotframework初始化时有返回值怎么处理

    方法一:set suite variable/set global variable 假设执行add school class会返回一个id,这个id在后面的脚本中还要使用. 因为初始化时只能有一个关 ...

  5. Mysql实现级联操作(级联更新、级联删除)(转)

    一.首先创建两张表stu,sc create table stu( sid int UNSIGNED primary key auto_increment, name varchar(20) not ...

  6. Codeforces Round #610 (Div. 2)E(模拟,DFS)

    先找到一条多边形的边,然后循环一圈输出多边形上的点.把每个三角形看作一个结点,以两个三角形之间公用边为边建立一张图,DFS输出叶子结点,则得到先切后切的顺序. #define HAVE_STRUCT_ ...

  7. 【C语言】用指针描述数组,实现选择法排序

    #include <stdio.h> int main() { ], t; int i, j, max; printf("请输入10个数:\n"); ; i <= ...

  8. Java经典面试笔试题及答案

    1.什么是对象序列化,为什么要使用? 所谓对象序列化就是把一个对象以二进制流的方式保存到硬盘上.好处:方便远程调用. 2.值传递与引用传递的区别? 所谓值传递就是把一个对象的值传给一个新的变量,但是系 ...

  9. 粪发涂墙-Redis

    Redis的高并发和快速原因 1.redis是基于内存的,内存的读写速度非常快: 2.redis是单线程的,省去了很多上下文切换线程的时间: 3.redis使用多路复用技术,可以处理并发的连接.非阻塞 ...

  10. 使用docker踩过的坑

    最近需要使用docker,但是win10电脑的系统不是docker windows适用版本,没法在windows上安装 于是就上centos虚拟机里面装了一个docker docker pull文件的 ...