ハイチャートでタイトルとサブタイトルを無効にする方法はありますか?


108

グラフの周りにあるhtmlを使用してハードコーディングするつもりです。組み込みを使用したくありません。

APIに「disable:true」オプションが表示されません。

誰かが私をここで助けてくれますか?

ハイチャートのタイトル/サブタイトルをどのように無効にしますか?

(単にテキストを空白のままにしておくと、タイトルがある場所の空白が切り分けられますが、これが起こらないようにしたいと思います)


4
回答を承認済みとしてマークできますか?;)
プラスチック

回答:


159

タイトルテキストを空の文字列に設定するのがその方法です。

その場合、タイトル用のスペースは作成されません。

テキストなし:http : //jsfiddle.net/jlbriggs/JVNjs/284/

テキスト付き:http : //jsfiddle.net/jlbriggs/JVNjs/286/

title:{
    text:''
}

その場合に残されるよりも少ないスペースが必要な場合は、単に 'marginTop'を0に設定します

{{ コメントが多いため編集

以下で何度も指摘したように、ドキュメントにはtext: nullこれを実現する方法として記載されています。

どちらの方法でも目的の結果が得られます。


これを見てください。私はここですべての提案を実行しましたが、まだ大きな空白があります(右上のスペースに浮かぶ印刷ボタンを参照してください?) goo.gl/jHR5l
D3Chiq

1
解決したと思います。凡例を上に揃えて、凡例のフローティングをfalseに設定すると、そこにスペースが作成されました。凡例のフローティングをtrueに設定すると、チャートの残りの部分がさらに押し上げられました。
D3Chiq 2013

2
以下で指摘するように、テキストをnullに設定することが文書化された解決策です。
トム・ハバード

1
バージョンの時点では、5.0.9これは正しくありません。空の文字列を生成するようにテキストを設定すると、「チャートタイトル」や「値」などのデフォルトのタイトルテキストが生成されます。
mwilson 2017年

@mwilson 5.0.9を使用している(このコメントの時点で)上記の回答のリンクからデモを見ていますが、それでもnullまたはで動作します''。詳しく説明またはデモできますか?
jlbriggs 2017年

61

ハイチャートのドキュメントから:

text:Stringグラフのタイトル。タイトルを無効にするには、テキストをnullに設定します。デフォルトはチャートタイトルです。

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

title:{
      text: null
      }

1
これは正解です。なぜこれが受け入れられないのかわかりません。以下に示す他のすべてのソリューションは、回避策にすぎません。
ジェラール

質問をしたユーザーである可能性があります。「受理済み」としてフラグを立てることを忘れる
プラスチック

2
おそらく、質問がこの回答が投稿される6か月前に適切に回答されたためです...
jlbriggs

「適切に」?? どういう意味ですか?;-)
プラスチック

4
これは「新しい」APIで正解です。質問されたとき、これはサポートされていませんでした。したがって、バージョンによってはどちらも有効です。
TecHunter 2016

40

私はこの方法を好みます:

title: {
    text: '',
    style: {
        display: 'none'
    }
},
subtitle: {
    text: '',
    style: {
        display: 'none'
    }
},

2
新しいバージョンについては、プラスチックからの「テキスト:null」の回答を参照してください
TecHunter


13

シンプルです...タイトルのテキストをnullに設定するだけです。このような

    $(function () {
$('#container').highcharts({
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },
    title: {
        text: null  
    },
    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]        
    }]
});

});

see @ APIreference:http ://api.highcharts.com/highcharts#title.text


1
ドキュメントに基づいて、それはundefinedこのコミットgithub.com/highcharts/highcharts/commit/…から
foxiris


9

あなたはいつでもこれを行うことができます:

chart:{
    marginTop: 30
}

title:{
    text: ''
}

それは私のために働いた:-)

注: この回答はversion 2.*に対するものでした。新しいバージョンでは、より適切な回答があります。


8

Highchartsのドキュメントによると、正しい方法は 'text'をnullに設定することです。


>チャートのタイトル。タイトルを無効にするには、テキストをundefinedに設定します。
Ini


3

以下の反応ネイティブでは、コードが私のために働きました、

  title: {
    style : {
      display : 'none'
    }
 }

お役に立てば幸いです。



1

Typescriptを使用する場合は、Highcharts.TitleOptionsを設定してグラフのタイトルを非表示にできます。

title: {
  text: undefined
},
subtitle: {
  text: undefined
}


-1

これは少しハックですが、それを試すこともできます:

title: {
    text: '<span class="hidden">My custom Hello</span>',
    align:"left",
    useHTML:true
}
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.