javascript - env.js 的 Highcharts 边界框问题

Question

在关于使用导出服务器和 PhantomJS 的服务器端的 Highcharts 的新专题文章中，提到了与 Env.js（与 Rhino 一起使用）中的边界框相关的问题。您能否发布一个由于 SVG 问题的边界框而导致图表呈现不正确的示例？有没有可能发生的特定模式？

Answer 1

我在 X 轴标签的自动定位方面遇到了问题。旋转文本的定位将是一个很好的起点。举个例子，什么不起作用 - 这是我找到的用于模拟 getBBox() 功能的函数：

 ep = Element.prototype;

 ep.getBBox = function() {
 var w = 10;
 if (ep.tagName == "TEXT" && ep.firstChild) {
   var s = ep.firstChild.innerHTML;
   w = s.length * 5;
 }

 return {
   x : ep.offsetLeft ? ep.offsetLeft : 0,
   y : ep.offsetTop ? ep.offsetTop : 0,
   width : w,
   height : 16
 };
};

如您所见，它非常简单——仅接近 Textlength 并返回默认宽度和高度。

Answer 2

Highcharts 计算例如 labeltext 的边界框。这是为了防止标签文本的冲突/重叠。您可以自己在 env.js 中测试此功能的细分，方法是结合使用小宽度图表和非常长的系列名称。我猜你必须想出自己的测试场景，看看 env.js 是否符合你的需求。