我正在使用highcharts的**'solidgauge'**。我改变了窗格的位置和大小，但我的标题和字幕位置没有改变。

我希望它们的位置如上图中红色箭头所示。

$(function () {

            var rawData = 90,
                data = getData(rawData);

            function getData(rawData) {
                var data = [],
                    start = Math.round(Math.floor(rawData / 10) * 10);
                data.push(rawData);
                for (i = start; i > 0; i -= 10) {
                    data.push({
                        y: i
                    });
                }
                return data;
            }
            
            var highCtr = document.getElementById('container');
            /*var smp = $("#highCtr")[0].getContext('2d');*/
            Highcharts.chart(highCtr, {
                chart: {
                    type: 'solidgauge',
                    marginTop: 10,
                    height: 200,
                    events: {
                        render: function () {
                            debugger;
                            var chart = this,
                                renderer = chart.renderer,
                                subtitle = chart.subtitle,
                                subtitleBBox = subtitle.getBBox(),
                                subtitleX = subtitleBBox.x,
                                subtitleY = subtitleBBox.y;

                            renderer.text('Subtitle X: ' + subtitleX, subtitleX, subtitleY - 20)
                                .attr({
                                    align: 'left'
                                })
                                .add();
                            renderer.text('Subtitle Y: ' + subtitleY, subtitleX, subtitleY - 5)
                                .attr({
                                    align: 'left'
                                })
                                .add();
                        }
                    }
                },
                credits: {
                    enabled: false
                },
                title: {
                    text: 'Level 1'
                },

                subtitle: {
                    text: rawData +'%',
                    style: {
                        'font-size': '25px'
                    },
                    /*x: -100,*/
                    align:'center',
                    y: 10,
                    zIndex: 1,
                    center: ['30%', '65%']
                   /* textAlign:left*/
                },

                tooltip: {
                    enabled: false
                },

                pane: [{
                    startAngle: -120,
                    endAngle: 120,
                    background: [{ // Track for Move
                        outerRadius: '100%',
                        innerRadius: '80%',
                        backgroundColor: Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0.3).get(),
                        borderWidth: 0,
                        shape: 'arc'
                    }],
                    /*size: '120%',*/
                    size: '80%',
                    center: ['30%', '65%']
                },
                    {
                    startAngle: -120,
                    endAngle: 120,
                        size: '80%',
                    center: ['30%', '65%'],
                    background: []
                }],

                yAxis: [{
                    min: 0,
                    max: 100,
                    lineWidth: 2,
                    lineColor: 'white',
                    tickInterval: 10,
                    labels: {
                        enabled: false
                    },
                    minorTickWidth: 0,
                    tickLength: 50,
                    tickWidth: 5,
                    tickColor: 'white',
                    zIndex: 6,
                    stops: [
                        //[0, '#fff'],
                        //[0.101, '#0f0'],
                        //[0.201, '#2d0'],
                        //[0.301, '#4b0'],
                        //[0.401, '#690'],
                        //[0.501, '#870'],
                        //[0.601, '#a50'],
                        //[0.701, '#c30'],
                        //[0.801, '#e10'],
                        //[0.901, '#f03'],
                        //[1, '#f06']
                        [0, '#f06'],
                        [0.101, '#f03'],
                        [0.201, '#e10'],
                        [0.301, '#c30'],
                        [0.401, '#a50'],
                        [0.501, '#870'],
                        [0.601, '#690'],
                        [0.701, '#4b0'],
                        [0.801, '#2d0'],
                        [0.901, '#0f0'],
                        [1, '#fff']
                    ]
                }, {
                    linkedTo: 0,
                    pane: 1,
                    lineWidth: 5,
                    lineColor: 'white',
                    tickPositions: [],
                    zIndex: 6
                }],

                series: [{
                    animation: false,
                    dataLabels: {
                        enabled: false,
                        format: '<div style="text-align:center"><span style="font-size:25px;color:' +
                            ((Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black') + '">{y}</span><br/>' +
                            '<span style="font-size:12px;color:silver">units</span></div>'
                    },
                    point: {
                        events: {
                            mouseOver: function () {
                                var point = this,
                                    yAxis = point.series.yAxis,
                                    subtitle = yAxis.subtitle;

                                if (subtitle) {
                                    var yAxisValue = point.y,
                                        yAxisText = yAxis.axisTitle.textStr;

                                    subtitle.attr({
                                        text: yAxisText + ': ' + yAxisValue
                                    });
                                }
                            },
                            mouseOut: function () {
                                var point = this,
                                    yAxis = point.series.yAxis,
                                    subtitle = yAxis.subtitle;

                                if (subtitle) {
                                    subtitle.attr({
                                        text: ''
                                    });
                                }
                            }
                        }
                    },
                    borderWidth: 0,
                    color: Highcharts.getOptions().colors[0],
                    radius: '100%',
                    innerRadius: '80%',
                    data: data
                }]
            });
        });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>
<script src="https://code.highcharts.com/modules/solid-gauge.js"></script>

 <div id="container"></div>

如何根据图表的大小和位置对齐副标题和标题？