ハイチャートでどのように反応タイトルを作ることができますか？

Question

私はhighchartsのドーナツグラフのタイトルが応答作るしようとしている - ここでは、私の現在のjsFiddleです： https://jsfiddle.net/klstack3/43Lqzznt/2/

HTML

<div class="wrapper"> 
<div id="container" style="width:100%;height:100%;"></div> 

CSS

.highcharts-title { 
font-weight: bold; 

Javascriptを

$(function() { 
$('#container').highcharts({ 
    chart: { 
     plotBackgroundColor: null, 
     plotBorderWidth: null, 
     plotShadow: false, 
    }, 
    title: { 
     text: "I want this to be responsive", 
        margin: 10, 
     align: 'center', 
     verticalAlign: 'middle', 

    }, 
    tooltip: { 
     pointFormat: '{name}: <b>{point.percentage:.1f}%</b>' 
    }, 
    plotOptions: { 
     pie: { 
      allowPointSelect: true, 
      cursor: 'pointer', 

     } 
    }, 
    series: [{ 
     type: 'pie', 
        data: [{ 
     name: 'Item', 
     y: 81.52, 
     sliced: true, 
     selected: true 
    }, { 
     name: 'Item', 
     y: 2.91, 
    }, { 
     name: 'Item', 
     y: 4.07 
    }, { 
     name: 'Item', 
     y: 2.07 
    }, { 
     name: 'Item', 
     y: 9.44 
    }], 
    innerSize: '50%', 
    }] 
}); 

$(window).resize(function(){ 
    var chart = $('#container').highcharts(); 

    console.log('redraw'); 
    var w = $('#container').closest(".wrapper").width() 
    // setsize will trigger the graph redraw 
    chart.setSize(  
     w,w * (3/4),false 
    ); 
}); 

チャートは、ブラウザでリサイズするが、私は同じことを行うために、タイトルを得ることができない - それはちょうどチャートと重なります。どんな助けでも大歓迎です！

Answer 1

チャート全体を扱うのと同じ方法でタイトルを扱うことができます。そのサイズはwindow.resize()に設定します。チャートが最初にレンダリングされた直後に呼び出すことができるように、私はdoResize機能にリサイズする責任のすべてのコードを移動し（そこには、ウィンドウのサイズ変更イベントませんし、それが明示的に呼び出す必要があり）：

function doResize() { 
    var chart = $('#container').highcharts(); 

    var w = $('#container').closest(".wrapper").width() 
     // setsize will trigger the graph redraw 

    console.log('redraw'); 
    chart.setSize(
     w, w * (3/4), false 
    ); 

    chart.title.update({ 
     style: { 
     fontSize: Math.round(chart.containerWidth/30) + "px" 
     } 
    }); 
    }; 

    $(window).resize(doResize); 
    doResize(); 

ライブデモ：https://jsfiddle.net/kkulig/jksp88p1/

---

APIリファレンス：https://api.highcharts.com/class-reference/Highcharts.Chart#.title