0

如果节点部分显示在画布上，则最左侧节点上的标签会消失。我该如何解决这个问题？

谢谢

4

2 回答 2

0

There is a much simpler way to fix this although it might not be as elegant.

First, use the CSS 3 overflow attribute on the div associated with the Spacetree. For example, if the div in your HTML page that is being used by infovis is 

      <div id="infovis"> </div>

Then, you want some CSS that makes sure that your canvas does not allow overflow.

#infovis {
  position:relative;
  width:inherit;
  height:inherit;
  margin:auto;
  overflow:hidden;
}

Next, in your your space tree definition, you probably have a placeLabel : function defined. At the end of it, simply set the style.display = "";. This force the label to be shown if the node is placed onto the canvas. For example:

        onPlaceLabel: function(label, node, controllers){          
            //override label styles
            var style = label.style;  
            if (node.selected) {    
              style.color = '#ccc';
            }
            else {
              style.color = '#fff';
            }
            // show the label and let the canvas clip it
            style.display = ''; 
        }

Thus, you are displaying the text and turning it over to the browser to clip any part of the node or the label that extend off the canvas.

于 2013-10-11T23:12:28.463 回答
0

当 InfoVis 断言标签会从画布上脱落时，它会尝试隐藏节点标签，如果它要显示在节点上的话。

它主要计算画布位置和尺寸、节点位置和尺寸，并尝试查看标签的位置是否在画布之外。

这可以分别在最终jit.js文件的第 9683 行placeLabel和第 7669 行附近看到。fitsInCanvas

在使用SpaceTree可视化时，我也遇到了这个问题。当我们尝试在移动设备中提供体面的体验时，这成为了一个问题，我找不到使画布平移工作的方法（因此，当节点标签部分消失时，我无法选择该节点并将整个居中因此，树，以允许进一步探索其他节点...）。

我所做的是更改功能fitsInCanvas：

fitsInCanvas: function(pos, canvas, nodeW, nodeH) {
  var size = canvas.getSize();
  if(pos.x >= size.width || (pos.x + nodeW) < 0
     || pos.y >= size.height || pos.y + nodeH < 0) return false;
   return true;
}

并相应地调用它placeLabel：

placeLabel: function(tag, node, controller) {
    ...
    ...
    ...
    var style = tag.style;
    style.left = labelPos.x + 'px';
    style.top  = labelPos.y + 'px';

    // Now passing on the node's width and heigh
    style.display = this.fitsInCanvas(labelPos, canvas, w, h)? '' : 'none'; 
    controller.onPlaceLabel(tag, node);
}

但是，这不是解决方案。你现在可能会看到你的标签从画布上掉下来，效果很奇怪，直到整个节点消失。而且，很明显，我直接改了源……应该在github上填一张票。

编辑：

实际上，似乎我正在使用旧版本的 lib。所讨论的行为变成了与我所描述的类似的东西。因此，无需更改代码。只需再次下载您的文件。具体来说，以下链接应为您提供这些更改：

于 2013-09-05T14:01:54.003 回答