Czy istnieje sposób na wyłączenie tytułu i podtytułu w Highcharts?

108

Zamierzam po prostu zakodować go na stałe za pomocą html, który jest wokół wykresu, nie chcę używać wbudowanego.

Nie widzę opcji „wyłącz: prawda” w interfejsie API.

Czy ktoś może mi tu pomóc.

Jak wyłączyć tytuł / podtytuł na listach przebojów?

(jeśli po prostu zostawisz tekst pusty, nadal będzie on tworzył białą spację w miejscu, w którym znajduje się tytuł, nie chciałbym, aby tak się stało)

highcharts D3Chiq
źródło
4
czy możesz oznaczyć odpowiedź jako zaakceptowaną? ;)
Plastic

Odpowiedzi:

159

Sposobem na zrobienie tego jest ustawienie tekstu tytułu na pusty ciąg.

W takim przypadku nie ma miejsca na tytuł:

bez tekstu: http://jsfiddle.net/jlbriggs/JVNjs/284/

z tekstem: http://jsfiddle.net/jlbriggs/JVNjs/286/

title:{
    text:''
}

Jeśli chcesz mieć mniej miejsca niż w tym przypadku, po prostu ustaw parametr „marginTop” na 0

{{ edytuj z powodu licznych komentarzy :

Jak wskazano kilka razy poniżej, dokumentacja podaje teraz text: nulljako metodę osiągnięcia tego.

Każda metoda daje pożądany rezultat.

jlbriggs
źródło
Czy mógłbyś mi na to spojrzeć? Zrobiłem wszystkie sugestie tutaj i nadal jest ogromna biała przestrzeń (zobacz przycisk drukowania unoszący się w przestrzeni w prawym górnym rogu?). Goo.gl/jHR5l
D3Chiq
1
Myślę, że mogłem to rozwiązać. Miałem swoją legendę wyrównaną do góry, a unoszenie się na legendzie było ustawione na fałsz, stworzyło tam dla niej miejsce. Ustawiłem unoszenie się legendy na prawdę, a teraz przesunęło resztę wykresu dalej w górę.
D3Chiq,
2
Jak wskazano poniżej, udokumentowanym rozwiązaniem jest ustawienie wartości null.
Tom Hubbard
1
Od wersji 5.0.9jest to niepoprawne. Ustawienie tekstu w taki sposób, aby pusty ciąg generował domyślny tekst tytułu, taki jak „Tytuł wykresu” i „Wartości”.
mwilson
@mwilson Patrzę na demo z linku w powyższej odpowiedzi, które (w momencie tego komentarza) używa wersji 5.0.9 i nadal działa z albo nulllub ''. Czy możesz rozwinąć lub zademonstrować?
jlbriggs
61

Z dokumentu highcharts :

text: String Tytuł wykresu. Aby wyłączyć tytuł, ustaw tekst na null. Domyślnie tytuł wykresu.

skrzypce: http://jsfiddle.net/daub10dr/

title:{
      text: null
      }
Plastikowy
źródło
1
To jest poprawna odpowiedź, nie wiem, dlaczego nie jest to akceptowana odpowiedź. Wszystkie inne rozwiązania podane poniżej to tylko obejścia.
Gerard,
Być może użytkownik, który zadał pytanie, po prostu zapomniał oznaczyć je jako „zaakceptowane”
Plastic
2
prawdopodobnie dlatego, że odpowiedź na pytanie była
poprawna
„odpowiednio” ?? co masz na myśli? ;-)
Plastic
4
Jest to poprawne w przypadku „nowego” interfejsu API. Gdy zadano pytanie, nie było to obsługiwane. Więc oba są ważne w zależności od wersji.
TecHunter
40

Wolę tę metodę:

title: {
    text: '',
    style: {
        display: 'none'
    }
},
subtitle: {
    text: '',
    style: {
        display: 'none'
    }
},
TecHunter
źródło
2
Aby uzyskać nowszą wersję, odnieś się do odpowiedzi od firmy Plastic z tekstem ´text: null´
TecHunter
17

Bardzo prosty! W najnowszej wersji Highcharts po prostu ustaw właściwości title i subtitle na false.

{
title: false,
subtitle: false
}

Znajdź działające skrzypce tutaj: https://jsfiddle.net/samuellawrentz/hkqnvm7k/4/

samuellawrentz
źródło
13

To proste ... Ustaw tylko tekst tytułu na null. Lubię to

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

});

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

aspadacio
źródło
1
Bazując na dokumencie, stało się to undefinedod tego zatwierdzenia github.com/highcharts/highcharts/commit/ ...
foxiris
9

Zawsze możesz to zrobić:

chart:{
    marginTop: 30
}

title:{
    text: ''
}

To zadziałało dla mnie :-)

uwaga: ta odpowiedź była dla version 2.*, dla nowszych wersji są lepsze odpowiedzi.

Andy
źródło
8

Zgodnie z dokumentem Highcharts, poprawnym sposobem jest ustawienie wartości „text” na wartość null.

Long Huynh
źródło
> Tytuł wykresu. Aby wyłączyć tytuł, ustaw tekst na niezdefiniowany.
Ini
3

Oto rozwiązanie

title: {
    text: null
},
subtitle: {
    text: null
}
RahulKurumkar
źródło
3

W React-Native poniższy kod zadziałał dla mnie,

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

Mam nadzieję, że to pomogło.

Iva
źródło
2

Po prostu napisz obiekt JSON

title : {
  style : {
    display : 'none'
  }
}
Ashish Bardiya
źródło
1

Dla tych, którzy używają Typescript, możesz ustawić Highcharts.TitleOptions, aby ukryć tytuł wykresu.

title: {
  text: undefined
},
subtitle: {
  text: undefined
}
Andrien Pecson
źródło
-1

To trochę hack, ale możesz też spróbować:

title: {
    text: '<span class="hidden">My custom Hello</span>',
    align:"left",
    useHTML:true
}
Hugo Chan
źródło