关闭

HighCharts柱状图显示百分比

标签: highCharts柱状图百分比
4304人阅读 评论(1) 收藏 举报
分类:

HighCharts柱状图没有提供显示百分比的API,只有饼图和堆叠柱状图能显示,调用接口是this.percentage。普通的柱状图想要在柱状图上面显示百分比需要调用formatter格式化输出百分比。

plotOptions: {
    column: {
        dataLabels: {
            enabled: true,  //显示数量提示
            color: '#000000',
            formatter : function() {
                a = this.y/data.total*100;    //a为当前柱状图y轴值除以总数然后乘以100
                return a.toFixed(2) + "%"+"<br/>"+this.y+"个";  //返回百分比和个数
            }
        }
    }
}

普通柱状图显示百分比

0
0
查看评论

Highcharts 中给图例加百分比

$('#chart').highcharts({ chart: { plotBackgroundColor: null, plotBorderWidth: null, ...
  • qq_17255515
  • qq_17255515
  • 2016-01-26 14:58
  • 4404

highcharts图表小例子,实现X轴只显示起点终点刻度,Y轴百分比显示

先上效果图: $(function(){ /*图表部分*/ var data = [29.9, 21.5, 26.4, 29.2, 24.0, 36.0, 35.6, 48.5, 26.4, 44.1, 45.6, 14.4,18.93, 31.5, 37.4,]; ...
  • cysear
  • cysear
  • 2015-11-09 13:28
  • 5809

highcharts 饼图显示数量和百分比

div class="piecleft" id="chart" style="height:350px; width: 350px;"> div> script t...
  • linfanhehe
  • linfanhehe
  • 2013-09-23 18:41
  • 16547

highchart 柱图设置 柱子宽度 柱子间距

在使用highcharts图表组件的时候,我们很多时候都需要用到分组或者非分组的柱形图,如果是分组,那么就必然会有着同一组柱子间间距问题的产生,通过这样一篇文章,我们就可以彻底认识柱子之间间距产生问题的根本所在,从而从根本问题上解决此类问题。让我们一起来认识这两个小家伙吧! 一、pointPa...
  • tzwjava
  • tzwjava
  • 2014-10-17 10:00
  • 6476

highcharts柱状图的高度跟柱状图上方显示的数字、提示框没关系

1、柱状图的高度跟柱状图上方显示的数字、提示框没关系(因为后台传过来的数据间隔太小) var _xaxis = ['1', '2', '3', '4', '5', '6', '7', &...
  • github_39051926
  • github_39051926
  • 2017-09-18 17:06
  • 1438

highcharts入门之Pie:如何让Pie饼状图的图例内显示百分比(转)

有很多人都在询问如何在highcharts的pie 饼状图内显示百分比,通过不断琢磨最后得出了一个结论,只需要简单配置即可实现这样一个需求。 完整核心代码如下所示:
  • ningwang0206
  • ningwang0206
  • 2014-06-01 21:38
  • 12098

软件缺陷度量中用EXCEL制作柏拉图的方法

用EXCEL制作柏拉图   1. 数据表如图,两列数据,每个模块缺陷数和累积缺陷比例   2. 选中每个模块缺陷数(B列)和累积缺陷比例(D列)这两列数据,插入柱图,如图: 3. 更改系列2为折线图: 选中系列2的图,右键...
  • zaizaiandniuniu
  • zaizaiandniuniu
  • 2013-06-14 18:07
  • 631

Highcharts应用--百分比条形图

Highcharts 是一个用纯JavaScript编写的一个图表库, 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表,并且免费提供给个人学习、个人网站和非商业用途使用。HighCharts支持的图表类型有曲线图、区域图、柱状图、饼状图、散状点图和综合图表。 现有一个需求,...
  • u010069853
  • u010069853
  • 2017-05-05 10:27
  • 348

新手学HighCharts(二)----对比柱状图的动态加载

highcharts数据显示形式 后台 B层实现层 Controller层 前台 JSP JavaScript    上一篇文章 新手学HighCharts(一)—-基本使用 中介绍了highCharts的基本使用,今天给大家介绍对比柱状图的使用,贴张图先:h...
  • u010853701
  • u010853701
  • 2016-01-09 11:11
  • 4671

Echarts bar图标怎么显示百分比

打开链接:http://echarts.baidu.com/echarts2/doc/example/bar14.html 将代码更改为如下代码: option = { title: { x: 'center', text: 'Ag...
  • u011019141
  • u011019141
  • 2016-10-13 10:17
  • 18201
    个人资料
    • 访问:52153次
    • 积分:748
    • 等级:
    • 排名:千里之外
    • 原创:22篇
    • 转载:0篇
    • 译文:0篇
    • 评论:8条
    文章分类
    最新评论