javascript - Highcharts Tootip in wrong location for multiple x axis -
i've got chart 2 x axis side-by-side, 1 series in each. when float on series 1 data, see tooltip, expected. when float on series 2 data, highlights line, no tooltip. however, if move cursor left @ same height data in series 2 data, above series 1 data, tooltip shows series 2 information, , series 2 points highlighted. here's example:
http://jsfiddle.net/q0gphwx2/5/
is there way correct this?
$(function () { $('#container').highcharts({ chart: { zoomtype: 'xy' }, plotoptions : { area : { stacking : 'normal', } }, title: { text: 'tooltip hover anomoly' }, subtitle: { text: 'float on series 2 data, stay @ same height, on series 1. ' }, xaxis: [{ width:300, categories: ['jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec'] },{ left: 400, width: 300, offset:0, categories: ['jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec'] } ], yaxis: [{ // secondary yaxis gridlinewidth: 0, title: { text: 'rainfall', style: { color: highcharts.getoptions().colors[0] } }, labels: { format: '{value} mm', style: { color: highcharts.getoptions().colors[0] } } }], tooltip: { shared: false }, series: [{ name: 'series 1', type: 'line', xaxis: 0, stack: 0, data: [10, 20, 30, 40, 50, 40, 30, 20, 10, 20, 30], tooltip: { valuesuffix: ' mm' } }, { name: 'series 2', type: 'line', xaxis: 1, stack: 1, data: [100, 120, 100, 120, 100, 120, 100, 120, 100, 120, 100, 120], tooltip: { valuesuffix: ' mm' } }] }); });
unfortunately known bug, reported our developers here
Comments
Post a Comment