设置饼图对应的提示文字的颜色与饼图块状一样,demo如下:

$(function () {
  $('#container').highcharts({
  chart: {
    plotBackgroundColor: null,
    plotBorderWidth: null,
    plotShadow: false
  },
  title: {
    text: '各练案等级分布'
  },
  tooltip: {
    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
  },

  colors:['#4dd3b9','#fdd67f','#ffaca8','#64bcec'],
  credits: {
    enabled: false
  },

  plotOptions: {

    pie: {
      allowPointSelect: true,
      cursor: 'pointer',
      format: '<b>{point.name}</b>: {point.percentage:.1f} %',
      dataLabels: {
        enabled: true,
        formatter: function() {
        if(this.point.name == '初级'){
          return '<span style="color:#4dd3b9">['+ this.point.name +' '+ Highcharts.numberFormat(this.percentage, 2)+'%]</span>';
        }else if(this.point.name == '中级'){
          return '<span style="color:#fdd67f">['+ this.point.name +' '+ Highcharts.numberFormat(this.percentage, 2)+'%]</span>';
        }else if(this.point.name == '高级'){
          return '<span style="color:#ffaca8">['+ this.point.name +' '+Highcharts.numberFormat(this.percentage, 2)+'%]</span>';
        }else if(this.point.name == '不分等级'){
          return '<span style="color:#64bcec">['+ this.point.name +' '+ Highcharts.numberFormat(this.percentage, 2)+'%]</span>';
          }
        }
      }
    }
  },
  series: [{
    type: 'pie',
    name: '占比',
    data: [
        ['初级', 46],
        ['中级', 29],
        ['高级', 15],
        ['不分等级',39]
      ]
    }]
  });
});

效果图:

Highcharts 饼图 文字颜色设置的更多相关文章

  1. iOS不得姐项目--登录模块的布局,设置文本框占位文字颜色,自定义内部控件竖直排列的按钮

    一.登录模块的布局 将一整部分切割成若干部分来完成,如图分成了三部分来完成 设置顶部状态栏为白色的方法 二.设置文本框占位文字颜色 <1>方法一与方法二实现原理是同一种,都是通过设置pla ...

  2. vc设置按钮文字颜色

    设置按钮文字颜色使用 CMFCBUTTON即可 在OnInitDialog函数加入如下内容即可 ((CMFCButton*)GetDlgItem(IDC_MFCBUTTON1))->SetTex ...

  3. 设置TabBarItem选中时的图片及文字颜色

    TabBarItem选中时,默认文字和图片都变为蓝色.使用以下代码可以进行修改. MainViewController *mainVC = [[MainViewController alloc] in ...

  4. HighCharts之2D颜色阶梯饼图

    HighCharts之2D颜色阶梯饼图 1.实例源码 PieGradient.html: <!DOCTYPE html> <html> <head> <met ...

  5. 设置LISTControl控件某一行的背景和文字颜色

    定义宏 用listcontrol的SetItemData设置某一行的属性,通过自定义属性标识实现. 自定义某行内容颜色属性: #define COLOR_DEFAULT 0 //默认颜色 #defin ...

  6. android TextView 设置部分文字背景色和文字颜色

    通过SpannableStringBuilder来实现,它就像html里边的元素改变指定文字的文字颜色或背景色 public class MainActivity extends Activity { ...

  7. android TextView 设置部分文字背景色 和 文字颜色

    通过SpannableStringBuilder来实现,它就像html里边的元素改变指定文字的文字颜色或背景色 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 ...

  8. 【Winform-GataGridView】根据DataGridView中的数据内容设置行的文字颜色、背景色 — 根据状态变色

    C#中可以根据每行内容的不同来对DataGridView数据表格控制每行的文字颜色.背景颜色进行不同的设置. 效果如下: 实现: 在DataGridView的RowPrePaint事件中进行行颜色控制 ...

  9. NumberPicker设置宽度,设置文字颜色

    修改宽度 wheel = (NumberPicker) findViewById(R.id.info_wheel_province); wheel.setLayoutParams(new Linear ...

随机推荐

  1. ThinkPad L440 FN键设置

    刚入手了ThinkPad L440,用起来相当不错,嘿嘿! L440系统默认(F1-F12)键盘为系统默认功能键,主要控制音量.亮度.连接投影仪等. 因为编写程序需要调试,经常用到F10,F11等键, ...

  2. sqlserver索引与查询优化

    此文为转载,仅做保存使用,出处:http://www.cr173.com/html/8688_all.html 在数据库存优化设计中往往会提到索引,这编文章就来详细的说明一下在 SQL SERVER ...

  3. 【随笔】Photoshop简单切图

    一.首先准备一张需要切割的图: 二.打开Photoshop,在ps里打开这张图片: 三.在界面的左边选择切片工具: 四.根据需要,鼠标点住上方和左边的标尺拖动,给图片加上分割辅助线: 五.用切片工具点 ...

  4. 【如何快速的开发一个完整的iOS直播app】(播放篇)

    原文转自:袁峥Seemygo    感谢分享.自我学习 前言 在看这篇之前,如果您还不了解直播原理,请查看上篇文章如何快速的开发一个完整的iOS直播app(原理篇) 开发一款直播app,集成ijkpl ...

  5. 「脑洞」图片转HTML(支持动画)

    也许是受到很久以前看到的这玩意儿的原因:The Shapes of CSS 现在开脑洞写了个自动转换,顺便支持了动画……嗯,纯 CSS (:з」∠) 主要步骤就是用 Python 读图片,然后把像素全 ...

  6. 解决JQuery.ajax.post乱码问题

    问题:昨天在进行项目功能实现时,利用了$.ajax吧数据post给服务,接着保存到cookie中,而数据中是带有中文的 我的post代码: comCarId=encodeURIComponent(co ...

  7. 使用AsyncTask实现文件下载并且在状态中显示下载进度

    2013年10月24日 上班的第二天 昨天我是用afinal完成的则个功能,但是公司里并不希望使用第三方的代码,所以要求我在不使用第三方开源项目的情况下实现. 最先我是使用Thread开启一个子线程, ...

  8. DEV word文档转换为pdf文件

    引用aspose.net控件2.0. docement doc=new document(文件路径和名称); doc.save(输出路径\file.pdf);

  9. Linux 下curl模拟Http 的get or post请求

    一.get请求 curl "http://www.baidu.com"  如果这里的URL指向的是一个文件或者一幅图都可以直接下载到本地 curl -i "http:// ...

  10. SVM系列之拉格朗日对偶

    在学习SVM(Support Vector Machine) 支持向量机时,对于线性可分的分类样本求出的分类函数为: 其中,分类超平面可以表示为: