Highcharts:cutom tooltip(useHTML:true)z-index问题over resetZoomButton

时间:2013-06-12 15:19:02

标签: highcharts

我的问题如下:

我已经创建了一个带格式化程序回调函数的自定义工具提示,并将useHTML属性设置为true。 useHTML的问题在于它不尊重z索引,结果是每当我放大图表时(实际显示重置缩放按钮时),重置按钮的文本都会被工具提示的文本覆盖。

   tooltip: {
        useHTML: true,
        followPointer: true,
        formatter: function() {
            return '<b>sSsSsSsSsSsSsssssssssssssssssssssS<br/>sdsdsddddddddddddssd</b>';
        }
   }

检查这个小提琴:http://jsfiddle.net/sahar_rehani/R5Ep4/

尝试放大,然后获取最接近重置缩放按钮的工具提示:) 请帮忙!!!

2 个答案:

答案 0 :(得分:2)

有一种改变Highcharts工具提示zIndex的简单方法:

chart.tooltip.label.attr({zIndex: 300});

尝试jsfiddle

答案 1 :(得分:-1)

只需删除useHTML:true line,您的问题就解决了!我知道这不是完美的解决方案,但会完成这项工作。当你混合svg和html时,z-index问题很常见。如果我找到更好的解决方案,我会跟进。您不需要使用HTML:true来执行您正在执行的格式设置。

        tooltip: {
            followPointer: true,
            formatter: function() {
                return '<b>sSsSsSsSsSsSsssssssssssssssssssssS<br />sdsdsddddddddddddssd</b>';
            }
        },

jsfiddle