Highcharts에서 제목과 부제목을 비활성화하는 방법이 있습니까?


108

그래프 주위에있는 html을 사용하여 하드 코딩 할 것입니다. 내장 된 것을 사용하고 싶지 않습니다.

API에 "disable : true"옵션이 표시되지 않습니다.

아무도 여기서 나를 도울 수 있습니까?

하이 차트에서 제목 / 부제목을 어떻게 비활성화합니까?

(텍스트를 비워두면 제목이있는 그 자리에 공백이 남아 있습니다. 이런 일이 발생하지 않게하고 싶습니다)


4
답변을 수락 된 것으로 표시해 주시겠습니까? ;)
Plastic

답변:


159

제목 텍스트를 빈 문자열로 설정하는 것이이를 수행하는 방법입니다.

이 경우 제목에 대한 공간이 생성되지 않습니다.

텍스트없이 : http://jsfiddle.net/jlbriggs/JVNjs/284/

텍스트 포함 : http://jsfiddle.net/jlbriggs/JVNjs/286/

title:{
    text:''
}

이 경우 남은 공간보다 적은 공간을 원하면 'marginTop'을 0으로 설정하십시오.

{{ 수많은 댓글로 인해 수정 :

아래에서 여러 번 지적했듯이 문서는 이제 text: null이를 달성하는 방법으로 명시 되어 있습니다.

두 방법 모두 원하는 결과를 얻습니다.


이걸 좀 봐주 시겠어요? 여기 모든 제안을했던 거대한 공백 (인쇄 버튼은 오른쪽 상단에 공간에 떠있는 볼?) 여전히 존재 goo.gl/jHR5l
D3Chiq

1
나는 그것을 해결했을 것이라고 생각한다. 내 범례를 맨 위에 정렬하고 범례에 떠 다니는 부분이 거짓으로 설정되어 거기에 공간이 생겼습니다. 나는 범례의 플로팅을 참으로 설정했고, 이제 차트의 나머지 부분을 더 끌어 올렸습니다.
D3Chiq 2013

2
아래에서 지적했듯이 텍스트를 null로 설정하는 것이 문서화 된 솔루션입니다.
Tom Hubbard

1
버전 5.0.9현재 이것은 올바르지 않습니다. 빈 문자열이 '차트 제목'및 '값'과 같은 기본 제목 텍스트를 생성하도록 텍스트를 설정합니다.
mwilson

@mwilson 나는 5.0.9를 사용하는 위의 답변 링크에서 데모를보고 있는데 (이 주석 당시) 5.0.9를 사용하고 있으며 여전히 null또는 ''. 자세히 설명하거나 시연 할 수 있습니까?
jlbriggs

61

로부터 highcharts의 문서 :

text : String 차트의 제목입니다. 제목을 비활성화하려면 텍스트를 null로 설정하십시오. 기본값은 차트 제목입니다.

바이올린 : http://jsfiddle.net/daub10dr/

title:{
      text: null
      }

1
이것은 정답입니다. 왜 이것이 허용되지 않는 대답인지 모르겠습니다. 아래에 제공된 다른 모든 솔루션은 해결 방법 일뿐입니다.
Gerard

"승인"로 질문을 사용자가 단지 플래그를 잊지 수 있음
플라스틱

2
이 답변이 게시되기 전에 질문이 적절 6 개월 대답했다 아마도 때문에 ...
jlbriggs

"적절하게"?? 무슨 대답이야 ?? ;-)
플라스틱

4
이것은 "새로운"api에서 정확합니다. 질문을 받았을 때 이것은 지원되지 않았습니다. 따라서 둘 다 버전에 따라 유효합니다.
TecHunter

40

이 방법을 선호합니다.

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

2
최신 버전은 "text : 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 문서에 따르면 올바른 방법은 '텍스트'를 null로 설정하는 것입니다.


> 차트 제목입니다. 제목을 비활성화하려면 텍스트를 정의되지 않음으로 설정하십시오.
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.