我尝试修改工具提示的默认样式。我想要带有尖角的顶部底部，如标注框。我找到了一个支持左右指针的示例。我修改了一些代码，实现了底部的指针，但是指针不能指向选定的点。jsFiddle的代码链接：http: //jsfiddle.net/yuezheng/AxqKY/90/。如何将框定位在所选点的顶部？
(function (Highcharts) {
Highcharts.Renderer.prototype.symbols.callout = function (x, y, w, h, options) {
var distance = 15,
arrowLength = 10,
halfDistance = 7.5,
r = options ? options.r : 5,
anchorX = (options && options.anchorX) || x,
anchorY = (options && options.anchorY) || y,
top = ['M', x + r, y, 'L', x + w - r, y],
topRight = ['C', x + w, y, x + w, y, x + w, y + r],
right = ['L', x + w, y + h - r],
rightBottom = ['C', x + w, y + h, x + w, y + h, x + w - r, y + h],
//bottom = ['L', x + r, y + h],
bottomLeft = ['C', x, y + h, x, y + h, x, y + h - r],
left = ['L', x, y + r],
leftTop = ['C', x, y, x, y, x + r, y],
bottom = ['L', x + w/2 + arrowLength, y + h,
x + w/2, y + h + arrowLength,
x + w/2 - arrowLength, y + h,
x, y + h];
/*
if (anchorX > w) {
right = [
'L', x + w, anchorY - halfDistance,
x + w + arrowLength, anchorY,
x + w, anchorY + halfDistance,
x + w, y + h - r
];
} else if (anchorX < 0) {
left = [
'L', x, anchorY + halfDistance,
x - arrowLength, anchorY,
x, anchorY - halfDistance,
x, y + r
];
}
*/
return top
.concat(topRight)
.concat(right)
.concat(rightBottom)
.concat(bottom)
.concat(bottomLeft)
.concat(left)
.concat(leftTop);
};
}(Highcharts));
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'line'
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
tooltip: {
shape: 'callout',
borderColor: '#AAA',
borderWidth: 1,
shadow: false,
borderRadius: 5
},
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]
}]
});