Есть ли способ отключить заголовок и подзаголовок в Highcharts?

108

Я просто собираюсь жестко его закодировать, используя html, который находится вокруг графика, я не хочу использовать встроенный.

Я не вижу в API опции «disable: true».

Кто-нибудь может мне здесь помочь.

Как отключить заголовок / подзаголовок в highcharts?

(если вы просто оставите текст пустым, он по-прежнему будет вырезать пробел в том месте, где находится заголовок, я бы хотел, чтобы это не происходило)

D3Chiq
источник
4
не могли бы вы отметить ответ как принятый? ;)
Plastic

Ответы:

159

Это можно сделать, установив для текста заголовка пустую строку.

В этом случае пространство для заголовка не создается:

без текста: http://jsfiddle.net/jlbriggs/JVNjs/284/

с текстом: http://jsfiddle.net/jlbriggs/JVNjs/286/

title:{
    text:''
}

Если вам нужно меньше места, чем осталось в этом случае, просто установите для параметра «marginTop» значение 0.

{{ edit из-за многочисленных комментариев :

Как указано несколько раз ниже, в документации теперь указывается text: nullспособ достижения этого.

Любой метод дает желаемый результат.

jlbriggs
источник
Не могли бы вы взглянуть на это для меня? Я сделал все предложения здесь, и все еще остается огромное белое пространство (видите кнопку печати, плавающую в пространстве вверху справа?) Goo.gl/jHR5l
D3Chiq
1
Думаю, я решил это. Моя легенда была выровнена по верхнему краю, а плавающий на легенде был установлен на false, это создало для нее место. Я установил плавающее значение для легенды в значение true, и теперь остальная часть диаграммы сдвинулась вверх.
D3Chiq
2
Как указано ниже, задокументированное решение - присвоить тексту значение null.
Tom Hubbard
1
По версии 5.0.9это неверно. Установка текста таким образом, чтобы пустая строка генерировала текст заголовка по умолчанию, такой как «Заголовок диаграммы» и «Значения».
mwilson
@mwilson Я смотрю на демонстрацию по ссылке в ответе выше, которая (на момент написания этого комментария) использует версию 5.0.9, и она по-прежнему работает с nullили ''. Вы можете уточнить или продемонстрировать?
jlbriggs
61

Из документа highcharts :

text: String Заголовок диаграммы. Чтобы отключить заголовок, установите для текста значение null. По умолчанию используется заголовок диаграммы.

скрипка: http://jsfiddle.net/daub10dr/

title:{
      text: null
      }
Пластик
источник
1
Это правильный ответ, не знаю, почему это не принятый ответ. Все остальные решения, представленные ниже, являются обходными путями.
Джерард
Возможно, пользователь, задавший вопрос, просто забыл пометить его как «принятый»
Plastic
2
вероятно, потому что на вопрос был дан правильный ответ за 6 месяцев до
публикации
"соответственно" ?? какой ответ ты имеешь ввиду ?? ;-)
Пластиковые
4
Это правильно с "новым" api. Когда был задан вопрос, это не получило поддержки. Так что оба действительны в зависимости от версии.
TecHunter
40

Я предпочитаю этот метод:

title: {
    text: '',
    style: {
        display: 'none'
    }
},
subtitle: {
    text: '',
    style: {
        display: 'none'
    }
},
TecHunter
источник
2
Для получения более новой версии обратитесь к ответу Plastic с «text: null»
TecHunter
17

Очень просто! В последней версии Highcharts просто установите для свойств title и subtitle значение false.

{
title: false,
subtitle: false
}

Найдите рабочую скрипку здесь: https://jsfiddle.net/samuellawrentz/hkqnvm7k/4/

Самуэллавренц
источник
13

Это просто ... Установить только нулевой текст заголовка. Как это

    $(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]        
    }]
});

});

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

Aspadacio
источник
1
Основываясь на документе, это становится undefinedпосле этого коммита github.com/highcharts/highcharts/commit/…
foxiris
10

Установите для текстового поля значение null

Из документации на http://api.highcharts.com/highcharts#title.text

текст: Строка

Заголовок диаграммы. Чтобы отключить заголовок, установите для текста значение null. По умолчанию используется заголовок диаграммы.

Thunderducky
источник
Основание на документе, он становится неопределенным , поскольку это обязательство github.com/highcharts/highcharts/commit/...
foxiris
9

Вы всегда можете это сделать:

chart:{
    marginTop: 30
}

title:{
    text: ''
}

Это сработало для меня :-)

примечание: этот ответ был предназначен version 2.*для более новых версий, есть ответы получше.

Энди
источник
8

Согласно документу Highcharts, правильный способ - установить для text значение null.

Long Huynh
источник
> Заголовок диаграммы. Чтобы отключить заголовок, установите для текста значение undefined.
Ини
3

Вот решение

title: {
    text: null
},
subtitle: {
    text: null
}
РахулКурумкар
источник
3

В реактивном коде ниже работал у меня,

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

Надеюсь, это помогло.

Ива
источник
2

Просто напишите объект JSON

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
}
Хьюго Чан
источник