5.3 标题

标题并不是图表的默认项，需要用户手动设置，才会显示。使用标题，可以帮助浏览者更好地了解和使用图例区。例如，可以添加说明告诉使用者，可以单击图例项目隐藏对应的数据列。设置标题的时候，需要使用legend.title项目。其语法形式如下：

legend: {
    title: {
        //配置项
            }
}

下面详细讲解标题的设置方式。

1．设置标题文本

Highcharts默认并没有指定标题文本，此时标题的文本为null，所以图例区不显示标题。用户可以通过配置项text设置标题文本。其语法如下：

text: String

其中，参数String指定标题的文本内容字符串，默认值为null。配置项text用来指定标题文本内容，也可以在字符串中包含简单的HTML标签，如<b>、<br/>、<em>、<i>和<strong>。这些标签可以起到格式化文本的效果。

【实例5-7：text】下面为图例区的标题添加斜体效果，修改代码如下：

legend: {
    title: {
        text:'<i>最高/最低温度</i>'           //设置图例标题
    }
}

执行代码后，效果如图5.14所示。从图中可以很清楚地看到，图例区增加了一个标题，内容为“最高／最低温度”，并且文字形式为斜体。

图5.14 设置图例标题

2．设置标题样式

虽然配置项text可以设置一定的样式，但样式形式较为单一。对于复杂的样式，建议使用配置项style。其语法如下：

style: CSSObject

其中，参数CSSObject可以为标题指定常见的CSS样式。默认值为{"fontWeight": "bold"}。