如何在使用高图时从工具提示中删除子弹?

时间:2016-11-22 07:24:40

标签: javascript jquery highcharts

我正在使用Highchart处理柱形图。我的图表工作正常。我只想删除工具提示中显示的子弹。从图像中,您可以看到子弹出现在金额之前。我该如何删除?如果有人有任何想法,请与我分享。

enter image description here

我的代码如下:

Jsfiddle link

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="hist" style="min-width: 310px; height: 400px; margin: 0 auto"></div>



$(document).ready(function() {

           Highcharts.setOptions({
        lang: {
            thousandsSep: ','
        }
    });
        // comma separation
        Highcharts.numberFormat = function (number, decimals, decimalPoint, thousandsSep) {

        number = +number || 0;
        decimals = +decimals;

        var lang = Highcharts.getOptions().lang,
            origDec = (number.toString().split('.')[1] || '').length,
            decimalComponent,
            strinteger,
            thousands,
            absNumber = Math.abs(number),
            ret;

        if (decimals === -1) {
            decimals = Math.min(origDec, 20); // Preserve decimals. Not huge numbers (#3793).
        } else if (!isNumber(decimals)) {
            decimals = 2;
        }

        // A string containing the positive integer component of the number
        strinteger = String(Highcharts.pInt(absNumber.toFixed(decimals)));

        // Leftover after grouping into thousands. Can be 0, 1 or 3.
        thousands = strinteger.length > 3 ? (strinteger.length - 1) % 2 : 0;

        // Language
        decimalPoint = Highcharts.pick(decimalPoint, lang.decimalPoint);
        thousandsSep = Highcharts.pick(thousandsSep, lang.thousandsSep);

        // Start building the return
        ret = number < 0 ? '-' : '';

        // Add the leftover after grouping into thousands. For example, in the number 42 000 000,
        // this line adds 42.
        ret += thousands ? strinteger.substr(0, thousands) + thousandsSep : '';

        // Add the remaining thousands groups, joined by the thousands separator
        ret += strinteger.substr(thousands).replace(/(\d{2})(?=\d{3})/g, '$1' + thousandsSep);

        // Add the decimal point and the decimal component
        if (decimals) {
            // Get the decimal component, and add power to avoid rounding errors with float numbers (#4573)
            decimalComponent = Math.abs(absNumber - strinteger + Math.pow(10, -Math.max(decimals, origDec) - 1));
            ret += decimalPoint + decimalComponent.toFixed(decimals).slice(2);
        }

        return ret;
    };

            $('#hist').highcharts({

            credits: { enabled: false },
            exporting: { enabled: false },
            chart: {
                type: 'column',
                backgroundColor: "transparent",
                plotBorderColor: '#ccc',
                plotBorderWidth: 1,
                borderWidth: 2,
                borderColor: '#ccc',
                /*borderRadius: 10,*/
                shadow: true,
                spacingBottom: 30,
                spacingTop:  30,
                spacingLeft:  30,
                spacingRight: 30
            },
            title: {
                text: 'Title here'
            },
            xAxis: {
            title: {text: "Rate",
                    style: {
                        fontWeight: 'bold',
                        fontSize:'14px'
                    } },
                categories: [
                  'ABC Percentage: 10.81%',
                  'CDE: 18.15%'
                ],
                labels: {
                    style: {
                        fontWeight: 'bold',
                        fontSize:'14px'
                    }
                },
                crosshair: false
            },
            yAxis: {
                min: 0,
                max: 1800000,
                title: {
                    text: 'Amount (Rs.)'
                },
                labels: {
                    formatter: function () {
                        return this.value/100000 + "L";
                    }
                }
            },
            tooltip: {

                headerFormat: '<b>Rate<br>{point.key}<br></b>',
                //pointFormat: '',
                //footerFormat: '<b>{point.key}</b>',
                //shared: true,
                useHTML: true,

            },
            plotOptions: {
                column: {
                    pointPadding: 0.2,
                    borderWidth: 0
                }
            },
            series: [{
                showInLegend: false,
                name: '<b>Amount (Rs.)</b>',
                data: [1070452, 1942379]
            }]
        });

});

2 个答案:

答案 0 :(得分:2)

按照以下代码使用格式化程序功能:

             useHTML: true,
             formatter: function () {
             return '<b>Rate</b><br/>'+this.point.category +'<br><b>'+this.series.name+'</b> '+ this.y ;
                }

请参阅your fiddle updated here

ToolTip screen-shot

答案 1 :(得分:0)

您可以通过更改工具提示/工具提示格式的外观来删除项目符号。 Tooltip format