有没有办法禁用Highcharts中的标题和副标题?


108

我将使用图表周围的html对其进行硬编码,但我不想使用内置的。

我在API中看不到“ disable:true”选项。

有人可以帮我吗?

如何在高图中禁用标题/字幕?

(如果您只是将文本保留为空白,那么它仍会在标题所在的位置切出空白,我想避免这种情况的发生)


4
您能否将答案标记为已接受?;)
Plastic

Answers:


159

将标题文本设置为空字符串是一种方法。

在这种情况下,不会为标题创建空间:

没有文字:http//jsfiddle.net/jlbriggs/JVNjs/284/

带有文本:http : //jsfiddle.net/jlbriggs/JVNjs/286/

title:{
    text:''
}

如果您想要的空间少于那种情况下的剩余空间,只需将您的'marginTop'设置为0

{{ 由于大量评论而编辑

如下面多次指出的那样,文档现在将其text: null作为实现此目的的方法。

两种方法都能达到预期的效果。


你能帮我看看吗?我已经在这里完成了所有建议,仍然有一个巨大的空白,(请参阅打印按钮浮在右上角的空间中?) goo.gl/jHR5l
D3Chiq 2013年

1
我想我可能已经解决了。我将图例与顶部对齐,并且图例上的浮动设置为false,在此处为其创建了一个空间。我将图例上的浮点数设置为true,现在它使图表的其余部分进一步上升。
D3Chiq

2
如下所述,将文本设置为null是有记录的解决方案。
Tom Hubbard 2014年

1
从版本开始,5.0.9这是不正确的。将文本设置为空字符串会生成默认标题文本,例如“图表标题”和“值”。
mwilson '17

@mwilson我正在上面的答案中的链接中查看演示,该链接(在撰写本文时)使用的是5.0.9,它仍然可以与null或一起使用''。您可以详细说明或演示吗?
jlbriggs

61

highcharts文档

text:字符串图表标题。要禁用标题,请将文本设置为null。默认为图表标题。

小提琴:http : //jsfiddle.net/daub10dr/

title:{
      text: null
      }

1
这是正确的答案,不知道为什么这不是可接受的答案。下面提供的所有其他解决方案只是解决方法。
杰拉德(Gerard)2015年

可能是提出问题的用户,只是忘记将其标记为“已接受”
Plastic

2
可能是因为在此答案发布前6个月,该问题已得到适当回答...
jlbriggs 2015年

“适当地”?你是什​​么意思?;-)
Plastic

4
这对于“新” api是正确的。当问这个问题时,不支持。因此,两个版本均有效,具体取决于版本。
TecHunter '16

40

我更喜欢这种方法:

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

2
对于较新的版本,请参考Plastic的“文本: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]        
    }]
});

});

请参阅@API参考: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。
燕丽


3

在下面的本机代码为我工作,

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

希望能有所帮助。





-1

这有点hack,但是您也可以尝试:

title: {
    text: '<span class="hidden">My custom Hello</span>',
    align:"left",
    useHTML:true
}
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.