highcharts Highchart Jmeter 图顶部被裁剪/隐藏

i5desfxk 于 9个月前发布在 Highcharts

关注(0)|答案(1)|浏览(68)

我正在使用Highcharts（https://www.highcharts.com/）库创建 Jmeter 图
Cropped Gauge chart
正如你在上面的图片中看到的， Jmeter 图在顶部被裁剪。
下面是我用同样的方法创建的JS Fiddle：
https://jsfiddle.net/4txnmdyp/3/

pane: {
    center: ['50%', '60%'],
    size: '200%',
    startAngle: -90,
    endAngle: 90,
    background: {
      backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || '#EEE',
      innerRadius: '60%',
      outerRadius: '100%',
      shape: 'arc'
    }

如果我将www.example.com更改chart.pane.center为[“50%"，“80%"] [不这样做的原因：我不希望图表在页面中更低]或将chart.pane.size减小到“80%”，它工作正常。[不这样做的原因：我不想要更小的图表]
我看到svg是基于瓦尔创建的，但是zindex瓦尔非常低，我怀疑有什么东西覆盖了它。

highcharts

来源：https://stackoverflow.com/questions/77036814/highchart-gauge-chart-top-portion-being-cropped-hidden

1条答案

按热度按时间

ar7v8xwq1#

这种截断的原因是您有一个不寻常的subtitle。它很长，所以所有的图表元素都适合在屏幕上，solidgauge已经减少。您使用pane.size强制它的大小加倍，因此负责绘制图表的逻辑将其解释为超出图的范围（如果您删除副标题，您可以看到这一点）。解决方案是设置subtitle.floating: true，这是在像您这样的情况下推荐的，即它位于不同的位置，并且您不希望在其原始位置为其生成空间。

Demo：https://jsfiddle.net/BlackLabel/8vhcg9zL/
API：https://api.highcharts.com/highcharts/subtitle.floating

赞(0）回复(0）举报 9个月前