Javascript 在highcharts中计算百分比和格式

Javascript 在highcharts中计算百分比和格式,javascript,jquery,highcharts,Javascript,Jquery,Highcharts,我在这里创建了一个向下钻取高图的小提琴https://jsfiddle.net/osnnneaj/2/。我需要格式化的工具提示与正确的百分比都在主图表和向下钻了。有人能告诉我怎么做吗 所以我需要工具提示来显示大概5%的总数 $(function () { $('#drillDown').highcharts({ chart: { type: 'column', renderTo: 'drillDown' },

我在这里创建了一个向下钻取高图的小提琴
https://jsfiddle.net/osnnneaj/2/
。我需要格式化的工具提示与正确的百分比都在主图表和向下钻了。有人能告诉我怎么做吗

所以我需要工具提示来显示大概5%的总数

$(function () {
    $('#drillDown').highcharts({
        chart: {
            type: 'column',
            renderTo: 'drillDown'
        },
        title: {
            text: 'Healthcare Operations'
        },
        subtitle: {
            text: 'Facility Revenue'
        },
        plotOptions: {
            series: {
                dataLabels: {
                    enabled: true,
                    format: '{point.name}: ${point.y}'
                }
            }
        },
        tooltip: {
            headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
            pointFormat:                 
            '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b> of total<br/>'

        },
        series: [{
            name: 'Facility',
            colorByPoint: true,
            data: [{
                name: 'Tanner Hospital System',
                y: 1000000,
                drilldown: 'Tanner Hospital System'
            }, {
                name: 'Wellstar Health',
                y: 2500000,
                drilldown: 'Wellstar Health'
            }, {
                name: 'Jacobs Medical Park',
                y: 370000,
                drilldown: 'Jacobs Medical Park'
            }, {
                name: 'Blue Star',
                y: 4200000,
                drilldown: 'Blue Star'
            }, {
                name: 'Cigna',
                y: 2700000,
                drilldown: 'Cigna'
            }, {
                name: 'Blue Cross',
                y: 3900000,
                drilldown: 'Blue Cross'
            }]
        }],
        drilldown: {
            series: [{
                name: 'Tanner Hospital System',
                id: 'Tanner Hospital System',
                data: [
                    {
                        name: 'Intensive Care',
                        y: 500000,
                        drilldown: 'Tanner Intensive Care Sub'
                    },
                    ['Orthopaedics', 300000],
                    ['Pediatrics', 200000],
                    ['Internal Medicine', 100000],
                    ['Cancer Unit', 100000]
                ]
            }, {
                name: 'Wellstar Health',
                id: 'Wellstar Health',
                data: [
                    ['Intensive Care', 100000],
                    ['Orthopaedics', 100000],
                    ['Pediatrics', 50000],
                    ['Internal Medicine', 25000],
                    ['Cancer Unit', 25000]
                ]
            }, {
                name: 'Jacobs Medical Park',
                id: 'Jacobs Medical Park',
                data: [
                    ['Intensive Care', 20000],
                    ['Orthopaedics', 10000],
                    ['Pediatrics', 4000],
                    ['Internal Medicine', 1500],
                    ['Cancer Unit', 1500]
                ]
            }, {
                name: 'Blue Star',
                id: 'Blue Star',
                data: [
                     {
                         name: 'Intensive Care',
                         y: 500000,
                         drilldown: 'Blue Star Intensive Care Sub'
                     },
                       {
                           name: 'Orthopaedics',
                           y: 10000000,
                           drilldown: 'Blue Star Orthopaedics'
                       },
                    ['Pediatrics', 1000000],
                    ['Internal Medicine', 500000],
                    ['Cancer Unit', 500000]
                ]
            }, {
                name: 'Cigna',
                id: 'Cigna',
                data: [
                    ['Intensive Care', 3000000],
                    ['Orthopaedics', 8000000],
                    ['Pediatrics', 1000000],
                    ['Internal Medicine', 500000],
                    ['Cancer Unit', 500000]
                ]
            },
            {
                name: 'Blue Cross',
                id: 'Blue Cross',
                data: [
                    ['Intensive Care', 3000000],
                    ['Orthopaedics', 8000000],
                    ['Pediatrics', 1000000],
                    ['Internal Medicine', 500000],
                    ['Cancer Unit', 500000]
                ]
            },

            {
                id: 'Tanner Intensive Care Sub',
                data: [
                  ['First Ward', 3000000],
                  ['ICU 2', 8000000],
                  ['ICU 3', 1000000],
                  ['ICU 4', 500000],
                  ['ICU 5', 500000]
                ]
            },
              {
                  id: 'Blue Star Intensive Care Sub',
                  data: [
                    ['First Ward', 3000000],
                    ['ICU 2', 8000000],
                    ['ICU 3', 1000000],
                    ['ICU 4', 500000],
                    ['ICU 5', 500000]
                  ]
              },
               {
                   id: 'Blue Star Orthopaedics',
                   data: [
                     ['First Ward', 3000000],
                     ['ICU 2', 8000000],
                     ['ICU 3', 1000000],
                     ['ICU 4', 500000],
                     ['ICU 5', 500000]
                   ]
               }
            ]
        }

    });
});
$(函数(){
$(“#向下展开”)。高图({
图表:{
键入:“列”,
renderTo:“向下搜索”
},
标题:{
文本:“医疗保健业务”
},
副标题:{
文本:“设施收入”
},
打印选项:{
系列:{
数据标签:{
启用:对,
格式:“{point.name}:${point.y}”
}
}
},
工具提示:{
headerFormat:“{series.name}
”, 点格式: {point.name}:{point.y:.2f}占总数的% }, 系列:[{ 名称:'设施', colorByPoint:对, 数据:[{ 名称:“坦纳医院系统”, y:1000000, 深入调查:“坦纳医院系统” }, { 名称:“Wellstar Health”, y:2500000, 深入调查:“Wellstar健康” }, { 名称:“雅各布斯医学园”, y:370000, 深入调查:“雅各布斯医疗园” }, { 名称:“蓝星”, y:4200000, 深入研究:“蓝星” }, { 名称:'信诺', y:2700000, 深入研究:“信诺” }, { 名称:“蓝十字”, y:3900000, 深入研究:“蓝十字” }] }], 向下展开:{ 系列:[{ 名称:“坦纳医院系统”, id:‘坦纳医院系统’, 数据:[ { 姓名:'重症监护', y:500000, 深入调查:“Tanner重症监护小组” }, [“骨科”,300000], ['Pediatrics',200000], [‘内科学’,100000], [“癌症单位”,100000] ] }, { 名称:“Wellstar Health”, id:“Wellstar Health”, 数据:[ [“重症监护”,100000], [“骨科”,100000], ['Pediatrics',50000], [《内科学》,25000页], [“癌症单位”,25000] ] }, { 名称:“雅各布斯医学园”, id:“雅各布斯医学园”, 数据:[ [“重症监护”,20000], [“骨科”,10000], [《儿科学》,4000], [《内科学》,1500], [“癌症单位”,1500] ] }, { 名称:“蓝星”, id:‘蓝星’, 数据:[ { 姓名:'重症监护', y:500000, 深入调查:“蓝星重症监护小组” }, { 名称:“骨科”, y:10000000, 深入研究:“蓝星整形外科” }, ['Pediatrics',1000000], [“内科”,500000], [“癌症单位”,500000] ] }, { 名称:'信诺', id:‘信诺’, 数据:[ [“重症监护”,3000000], [“骨科”,8000000], ['Pediatrics',1000000], [“内科”,500000], [“癌症单位”,500000] ] }, { 名称:“蓝十字”, id:‘蓝十字’, 数据:[ [“重症监护”,3000000], [“骨科”,8000000], ['Pediatrics',1000000], [“内科”,500000], [“癌症单位”,500000] ] }, { id:‘Tanner重症监护小组’, 数据:[ [‘第一病房’,3000000], [ICU 2',8000000], [ICU 3',1000000], [ICU 4',500000], [ICU 5',500000] ] }, { id:‘蓝星重症监护小组’, 数据:[ [‘第一病房’,3000000], [ICU 2',8000000], [ICU 3',1000000], [ICU 4',500000], [ICU 5',500000] ] }, { id:‘蓝星整形外科’, 数据:[ [‘第一病房’,3000000], [ICU 2',8000000], [ICU 3',1000000], [ICU 4',500000], [ICU 5',500000] ] } ] } }); });

谢谢

假设JSFIDLE中的dataTotal是图表上所有条形图的总和:

   tooltip: {
        formatter: function() {                    
                var pcnt = (this.y / 37170000) * 100;
         return this.x + ' ' + Highcharts.numberFormat(pcnt) + '%';
            }         
    },
    series: [{

但你所有的百分比总和并不是100%。固定演示:好的,所有公司的总收入是14670000。第一列是1000000。1000000/14670000=.0682那么问题出在哪里?