2016-09-21 13 views
0

ボタンを使用して、グラフの種類を円グラフと縦列に切り替えます。 Pieがデフォルトです。列に切り替えると、カテゴリは表示されません。ここでImage: Pie is the default円から列に切り替えてラベルを表示

はフィドルです:http://jsfiddle.net/Gebifa/vLrx47a6/1/

は私がaleady x軸のカテゴリを設定しようとしましたが、唯一のHighchartsエラー18を得た - 要求された軸が存在していません。誰かがラベルを表示する方法を知っていますか?前もって感謝します。

exporting: { 
      buttons: { 
       contextButton: { 
        symbol: 'url(../../img/chartexport.png)' 
       }, 
       barButton: { 
        x: -30, 
        _titleKey: 'barChart', 
        onclick: function() { 
         $.each(this.series,function(i,serie){ 
          serie.update({ 
           type:'column', 
           tooltip: { 
            positioner: function() { 
             return { x: 0, y: 0 }; 
            }, 
            pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b><br/>', 
            shared: true 
           } 
          }); 
         }); 
        }, 
        symbol: 'url(../../img/chartButtonBar.png)' 
       }, 
       pieButton: { 
        x: -60, 
        _titleKey: 'pieChart', 
        onclick: function() { 
         $.each(this.series,function(i,serie){ 
          serie.update({ 
           type:'pie', 
           tooltip: { 
            positioner: function() { 
             return { x: 0, y: 0 }; 
            }, 
            pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.percentage:.2f}%</b><br/>', 
            shared: true 
           } 
          }); 
         }); 
        }, 
        symbol: 'url(../../img/chartButtonPie.png)' 
       } 
      }, 
+0

あなたはフィドルを提供しますか? –

+0

dataLabels:{enabled:true}を列の系列に追加してみてください –

答えて

0

これは、2つのチャートを切り替える際に役立ちます。問題が解決しない場合は、フィドルを提供してください。

$('#Pie').click(function() { 
    chart.inverted = true; 
    chart.xAxis[0].update({}, false); 
    chart.yAxis[0].update({}, false); 
    chart.series[0].update({ 
     type: 'pie' 
    }); 
} 

http://jsfiddle.net/wvymmy80/

私はコードの下に交換してみてください、あなたのX軸の設定は少し問題があり、タイトルがX軸configuration.Pleaseで必要とされていないと思います。

xAxis: { 
     categories: ["20-29 years", "30-39 years", "40-49 years", "50-59 years", "60-69 years", ], 
     enabled: false, 
     text: '', 
     style: { 
     color: '#656565' 
     }, 
    tickmarkPlacement: 'between', 
    labels: { 
     style: { 
     color: '#656565' 
     }, 
     rotation: 0 
    }, 
    crosshair: true 
    }, 

フィドル:http://jsfiddle.net/xxLochh6/

+0

ありがとうございます。残念ながら私にとってはうまくいきませんでした。コードを追加したフィドルを見てください。 – Susi

+0

修正プログラムで私の回答を更新しました。 –

+0

はい!それはそれをした!どうもありがとう!愚かな括弧... :) – Susi

関連する問題