highcharts - 如何自定义图表标题和副标题

Question

我想自定义我的图表，主要是标题和副标题，如所附图像。请建议！我也喜欢在面积图中添加渐变。可以这样设计图表吗？

Answer 1

您可以将useHTML 设置为true，并在标题文本中定义两个具有正确CSS 样式的div（左/右内容）。

text: '<div class="lhsTitle">My custom title</div><div class="rhsTitle">Right content</div>',

CSS

.lhsTitle {
    float:left;
}
.rhsTitle {
    float:right
}

.highcharts-title {
    width:80%;
}

http://jsfiddle.net/sbochan/BETBk/

Answer 2

您可以使用以下代码片段向系列添加线性渐变：

... //inside Highcharts chart object

series : [{
    name : "Series name",
    type : "area",
    fillColor : {
        linearGradient : [0, 0, 0, 300],
        stops : [
            [0, Highcharts.getOptions().colors[3]],
            [1, 'rgba(2,0,0,0)']
        ]
    },
    data: [...]
}]

如下例所示：http: //jsfiddle.net/aNtnm/