2016-04-09 2 views
1

ToolTip будет обрезана, как показано ниже, если данные на концах диаграмм очень малы, как показано на рисунке ниже. Просьба предложить решение этойКак установить положение первого и последнего дочерних элементов всплывающей подсказки

enter image description here

+0

Вы можете использовать такое решение, как здесь: http://stackoverflow.com/questions/17680627/highcharts-tooltip-cropping –

ответ

1

Вы могли бы использовать 2 различные решения. Во-первых, рассчитывать, если подсказке нужно показать справа или слева:

positioner: function (labelWidth, labelHeight, point) { 
    var tooltipX, tooltipY; 
    if (point.plotX + labelWidth > chart.plotWidth) { 
     tooltipX = point.plotX + chart.plotLeft - labelWidth - 20; 
    } else { 
     tooltipX = point.plotX + chart.plotLeft + 20; 
    } 
    tooltipY = point.plotY + chart.plotTop - 20; 
    return { 
     x: tooltipX, 
     y: tooltipY 
    }; 
} 

Fiddle: http://jsfiddle.net/jugal/eSfy8/?utm_source=website&utm_medium=embed&utm_campaign=eSfy8

Или с фиксированным положением подсказке:

positioner: function (labelWidth, labelHeight, point) { 
    var tooltipX, tooltipY; 
    if (point.plotX + chart.plotLeft < labelWidth && point.plotY + labelHeight > chart.plotHeight) { 
     tooltipX = chart.plotLeft; 
     tooltipY = chart.plotTop + chart.plotHeight - 2 * labelHeight - 10; 
    } else { 
     tooltipX = chart.plotLeft; 
     tooltipY = chart.plotTop + chart.plotHeight - labelHeight; 
    } 
    return { 
     x: tooltipX, 
     y: tooltipY 
    }; 
} 

Fiddle: http://jsfiddle.net/jugal/8cJD7/?utm_source=website&utm_medium=embed&utm_campaign=8cJD7

С типом диаграммы всплывающая подсказка такая же, вам нужно только позаботиться, если определен «график» (обычно есть).

Надеюсь, это поможет!