javascript - Vis.js .fit() ile ölçek 1.0'dan daha fazla yakınlaşmıyor

Ağı göstermek için Vis.js kütüphanesini kullanıyorum. Uygulamam için, ağın tam ekran olarak görüntülenmesini ve düğümlerin neredeyse konteynerinin sınırlarına değmesini istiyorum.

Sorun network.fit(); fonksiyonundan geliyor; bu, ölçek '1.0'dan daha fazla yakınlaştırmayacak

Sorunu göstermek için bir Fiddle yazdım: http://jsfiddle.net/v1467x1d/12/

var nodeSet = [
    {id:1,label:'big'},
    {id:2,label:'big too'} ];

var edgeSet = [ 
    {from:1, to:2} ];

var nodes = new vis.DataSet(nodeSet);
var edges = new vis.DataSet(edgeSet);

var container = document.getElementById('mynetwork');
var data = {
    nodes: nodes,
    edges: edges
};
var options = {};

var network = new vis.Network(container, data, options);
network.fit();
console.log( 'scale: '+ network.getScale() ); // Always 1

Ağı tam ekran olana kadar Vis'i yakınlaştırmaya nasıl zorlayabilirim?

Cevap #1

Richard'ın dediği gibi - şimdi, bu yöntem beklendiği gibi çalışmıyor. Bir kavram olarak, özel bir yöntem kullanabilirsiniz:

function bestFit() {

  network.moveTo({scale:1}); 
  network.stopSimulation();
   
  var bigBB = { top: Infinity, left: Infinity, right: -Infinity, bottom: -Infinity }
  nodes.getIds().forEach( function(i) {
    var bb = network.getBoundingBox(i);
    if (bb.top < bigBB.top) bigBB.top = bb.top;
    if (bb.left < bigBB.left) bigBB.left = bb.left;
    if (bb.right > bigBB.right) bigBB.right = bb.right;
    if (bb.bottom > bigBB.bottom) bigBB.bottom = bb.bottom;  
  })
  
  var canvasWidth = network.canvas.body.container.clientWidth;
  var canvasHeight = network.canvas.body.container.clientHeight; 

  var scaleX = canvasWidth/(bigBB.right - bigBB.left);
  var scaleY = canvasHeight/(bigBB.bottom - bigBB.top);
  var scale = scaleX;
  if (scale * (bigBB.bottom - bigBB.top) > canvasHeight ) scale = scaleY;

  if (scale>1) scale = 0.9*scale;
 
  network.moveTo({
    scale: scale,
    position: {
        x: (bigBB.right + bigBB.left)/2,
      y: (bigBB.bottom + bigBB.top)/2
    }
  })
  
}

[ http://jsfiddle.net/dv4qyeoL/ ]

Cevap #2

Üzgünüm, bunu network.fit kullanarak yapmak imkansız. İşte ilgili kod.

Ancak, bunu kendiniz yamayabilir ve değiştirilmiş sürümü uygulamanıza dahil edebilirsiniz, bu durumda uygulama beklendiği gibi çalışmalıdır. İşte bir örnek (değişiklik için satır 38337). Ancak başka bir şeyi bozmayacağını garanti edemem.

İlgili kod :

/*if (zoomLevel > 1.0) {
  zoomLevel = 1.0;
} else if (zoomLevel === 0) {
  zoomLevel = 1.0;
}*/
if (zoomLevel === 0) {
  zoomLevel = 1.0;
}