goJS фоновый слой не отображать

Question

Я использую goJS код, который точно так же, как эта ссылка страницы http://gojs.net/temp/swimBands2.html

Это выглядит красиво, когда узел является простым, но когда он идет с большим количеством данных переплетены внутри каждого узла, кажется, что заголовок не отображается. Я должен уменьшить масштаб, чтобы увидеть его.

Может кто-нибудь помочь мне, что я должен делать?

я изменить код, чтобы быть ниже

myDiagram.nodeTemplateMap.add("VerticalBands", 
       $(go.Part, "Position", 
         { 
          isLayoutPositioned: false, // but still in document bounds 
          locationSpot: new go.Spot(0, 0, 0, 16), // account for header height 
          layerName: "Grid", // not pickable, not selectable 
          itemTemplate: 
            $(go.Panel, "Vertical", 
              new go.Binding("opacity", "visible", function(v) { return v ? 1 : 0; }), 
              new go.Binding("position", "bounds", function(b) {b.position.y+= 30;return b.position; }), 
              $(go.TextBlock, 
                { 
                 stretch: go.GraphObject.Horizontal, 
                 textAlign: "center", 
                 wrap: go.TextBlock.None, 
                 font: "bold 11pt sans-serif", 
                 background: $(go.Brush, go.Brush.Linear, { 0: "lightgray", 1: "whitesmoke" }) 
                }, 
                new go.Binding("text"), 
                new go.Binding("width", "bounds", function(r) { return r.width; })), 
              // for separator lines: 
              //$(go.Shape, "LineV", 
              // { stroke: "gray", alignment: go.Spot.Left, width: 1 }, 
              // new go.Binding("height", "bounds", function(r) { return r.height; }), 
              // new go.Binding("visible", "itemIndex", function(i) { return i > 0; }).ofObject()), 
              // for rectangular bands: 
              $(go.Shape, 
                { stroke: null, strokeWidth: 0 }, 
                new go.Binding("desiredSize", "bounds", function(r) { return r.size; }), 
                new go.Binding("fill", "itemIndex", function(i) { return i % 2 == 0 ? "white" : "lightgray"; }).ofObject()) 
            ) 
         }, 
         new go.Binding("itemArray") 
       )); 

я изменить locationSpot быть новым go.Spot (0,0,0, -8), заголовок спускаясь однако положение узла оставаться прежним.

Answer 1

Это потому, что часть, которая держит «группы» находится в «сетке» слоя, и части, которые находятся в этом слое не включены в Diagram.documentBounds , поэтому пользователи (по умолчанию) не могут прокручивать границы документа.

Существует несколько возможных решений, в зависимости от того, что вы хотите разрешить своим пользователям.

Вы можете установить Diagram.scrollMode в go.Diagram.InfiniteScroll, что позволяет пользователям прокручивать все, что захочет. Но я не знаю, хотите ли вы это позволить - пользователи могут потеряться.

Или, вы можете изменить «Сетка» слой: myDiagram.findLayer("Grid").isBoundsIncluded = true; так, чтобы части этого слоя автоматически включаются в Diagram.documentBounds. Если у вас есть что-то еще в этом слое, это может или не желательно.

Или вы могли бы положить, что «VerticalBands» часть в нормальном слое и сделать его не pickable или по выбору: layerName: "Background", selectable: false, pickable: false, Это менее желательно, если вы используете слой «Background» для проведения других частей.