赌注标签不是中心对齐的

时间:2017-03-15 13:53:11

标签: jquery highcharts

您好我正在绘制一个柱形图但无法居中对齐标题我附上截图供参考 Screenshot

堆叠标签中的第二个数字是左对齐的,当我使其中心对齐其工作正常但在刷新图形后,对齐将保持左对齐。如何解决它。



<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; max-width: 800px; height: 400px; margin: 0 auto"></div>
        var chart = {
            type: 'column',
            plotBorderWidth: 0,
            plotShadow: false,
            marginRight: '4',
            borderWidth: 0
        };
        var title = {
            text: 'Top 5 Buyers'
        };
        var subtitle = {
            text: '<a style="font-size:smaller;text-decoration: underline;cursor: pointer" href="#">Investors</a>',
            verticalAlign: 'bottom',
            align: 'center',
            X: -5,
            color: 'blue'
        };
        var xAxis = {
            categories: ['Investor Mutual <br>Australian share fund', 'Mr Grills T greyar', 'California Public employees', 'State street Global Advisors', 'MLC Limited'],
            gridLineWidth: 0,
            minorGridLineWidth: 0,
            lineWidth: 0,
            //lineColor: 'transparent',
            minorTickLength: 0,
            tickLength: 0
        };
        var yAxis = {
            min: 0,
            max: 120,
            endOnTick: false,
            title: {
                text: 'Total fruit consumption'
            },
            stackLabels: {
                enabled: true,
                verticalAlign: 'center',
                align: 'center',
                x: -10,
                y: -15,
                formatter: function() {
                    //return this.axis.chart.xAxis[0].categories[this.x] + '<br>$' + this.total;
                    return "10,124100"+ '<br>$' + this.total;
                },
            }



        };
        var tooltip = {
            // pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.percentage:.0f}%)<br/>',
            //  shared: true,
            valueDecimals: 2,
            formatter: function() {
                return '<div> ' + this.point.name.toUpperCase() + '<br />' + 'SHARES:       ' + '<br />' + '<b>%IC: ' + Highcharts.numberFormat(this.percentage, 2) + ' %' + '</b>' + '<br />' + 'NO. INVESTORS: ' + '</div>';
            }
        };
        var plotOptions = {
            column: {
                datalabels: {
                    enabled: true
                },
                
            cursor: 'pointer'
        },

            series: {
                stacking: 'percent',
            pointWidth: 50,
            groupPadding: 1
            }
    };
    var credits = {
        enabled: false
    };
    var series = [{
        color: '#02C362',
        showInLegend: false,
        data: [293534023, 2817040, 901773, 690000, 560556],
       //  data: [5, 3, 4, 7, 2],
        // pointPadding: 0.8,
        // pointPlacement: -0.2,
    }, {
        Color: '#004C99',
        showInLegend: false,
        data: [21549709, 11980000, 46071, 750000, 609300],
       // data: ['3', '4', '4', '2', '5'],
        // pointPadding: 0.8,
        // pointPlacement:-0.2,
    }];

    var json = {};
    json.chart = chart;
    json.title = title;
    json.xAxis = xAxis;
    json.yAxis = yAxis;
    json.tooltip = tooltip;
    json.plotOptions = plotOptions;
    json.credits = credits;
    json.series = series;
    json.subtitle = subtitle;
    $('#container').highcharts(json);
 
&#13;
&#13;
&#13;

Fiddle

0 个答案:

没有答案