highcharts tooltip中 css 关于样式透明的问题

Question

在highcharts的图表绘制中，出现了图2的情况

图1

图2

如上图所示，可以看到在我使用了较深的颜色后，左侧的标签像是穿过了tooltip的弹出层，还和文字重叠在一起了，而右侧tooltip是把下面的内容给覆盖了的，两边呈现出不同的效果，这是什么原因导致的呢，涉及到的相关属性是什么，我应该怎么修复这个问题？

出现这个问题是我的labels标签使用了html渲染的方式

formatter: function() {
    return single != "" ? '<span title="' + this.value + '">' + 
    this.value + '</span>' : '<span class="x-labels" title="' + 
    this.value + '">' + this.value + '</span>'
},
useHTML: true

目的就是通过自定义，来限制左侧标签的长度，让长度统一

.x-labels{
        width: 100px;
        display: inline-block;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space: nowrap;
    }

如果不自定义，是不会出现这个问题，猜测svg渲染和html混用有不兼容的地方？如果是这样，那么官方的自定义完全不能用嘛，引出了新的问题，求助我应该怎么解决这个问题？

Answer 1

没什么人回答呢，其实我就想知道是什么属性影响的。而且这个问题你自定义肯定会出现的。我只能先把HTML渲染去掉了