Is there a way to disable the Title and Subtitle in Highcharts?

Question

I'm just going to hardcode it in using html that is around the graph, I don't want to use the built in.

I don't see a "disable: true" option in the API.

Can anybody help me out here.

How do you disable the title / subtitle in highcharts?

(if you simply leave the text blank it still carves out a whitespace in that spot where the title is, i'd like to not have this happen)

Answer 1

Setting the title text to an empty string is the way to do it.

No space is created for the title in that case:

without text: http://jsfiddle.net/jlbriggs/JVNjs/284/

with text: http://jsfiddle.net/jlbriggs/JVNjs/286/

title:{
    text:''
}

If you want less space than is left in that case, simply set your 'marginTop' to 0

{{edit due to numerous comments:

As pointed out a number of times below, the documentation now states text: null as the method to achieve this.

Either method achieves the desired result.

Answer 2

From the highcharts doc:

text: String The title of the chart. To disable the title, set the text to null. Defaults to Chart title.

fiddle: http://jsfiddle.net/daub10dr/

title:{
      text: null
      }

Answer 3

I prefer this method :

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

Answer 4

Very simple! In the latest version of Highcharts just set title and subtitle properties to false.

{
title: false,
subtitle: false
}

Find the working fiddle here: https://jsfiddle.net/samuellawrentz/hkqnvm7k/4/

Answer 5

It´s simple... Only set the title´s text to null. Like this

    $(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

Answer 6

You can always do this:

chart:{
    marginTop: 30
}

title:{
    text: ''
}

That worked for me :-)

note: this answer was for version 2.*, for newer versions there are better answers.

Answer 7

Set the text field to null

From the documentation at http://api.highcharts.com/highcharts#title.text

text: String

The title of the chart. To disable the title, set the text to null. Defaults to Chart title.

Answer 8

According the Highcharts doc, the correct way is to set 'text' to null.

Answer 9

In react-native below code worked for me,

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

Hope it helped.

Answer 10

Here is the solution

title: {
    text: null
},
subtitle: {
    text: null
}

Answer 11

For those that use Typescript you can set the Highcharts.TitleOptions to hide the chart title.

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

Answer 12

Just write a JSON object

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

Answer 13

This works for me!!!

title:false

Answer 14

This is a bit of a hack but you can also try that:

title: {
    text: '<span class="hidden">My custom Hello</span>',
    align:"left",
    useHTML:true
}