Questions regarding Tree View

GoJS
1

I based my code on the sample for Tree View, which doesn’t exhibit this behavior, so I’m not really sure what is going on, but …

  1. When the page first loads and I click on a node in the tree, the whole palette scrolls down to the bottom of the container. Per another thread I saw, I’ve tried setting contentAlignment: go.Spot.Top but to no avail. Any ideas?

  2. For some reason, I’ve lost the ability to single click and expand nodes in the tree. The doubleClick handler works fine, but I really want to use single click instead.

Thanks much for any guidance!

2

  1. It’s hard to say what would be causing that. Where did you try setting the contentAlignment? Are you able to reproduce the behavior with a simple example?

  2. You should be able to change the doubleClick function on the node template to just a click function and get the same behavior.

3

Hi there, and thanks for the quick response! You guys are so amazing with support and answering questions. I have a feeling that you guys are like me, and never get any sleep!

At any rate, regarding #1, here is where I have it:

    paletteTree =
  $(go.Palette, "paletteDiv",
    {
      allowMove: false,
      allowCopy: true,
      allowDelete: false,
      allowZoom: true,
      allowDragOut: true,
      allowHorizontalScroll: false,
      contentAlignment: go.Spot.Top,
      layout:
        $(go.TreeLayout,
          {
            alignment: go.TreeLayout.AlignmentStart,
            angle: 0,
            compaction: go.TreeLayout.CompactionNone,
            layerSpacing: 16,
            layerSpacingParentOverlap: 1,
            nodeIndent: 2,
            nodeIndentPastParent: 1.0,
            nodeSpacing: 5,
            breadthLimit: 0,
            setsPortSpot: false,
            setsChildPortSpot: false,
          })
  });

I think that is the right place … ? I can try to put something together in a stand-alone example.

Regarding #2 - worked like a champ!

Thanks!

4

Yes, that should be correct, but may not be necessary. What about your code differs from the Palette in this codepen? Are you able to modify this so it behaves like yours?

5

After a quick Codepen session, it would appear that it has to do with the height of the parent container. Mine is fairly tall, at 700px or so. If I change my parent container’s height to something smaller, say 300px, it works fine. Looks like when the parent container is taller than the fully expanded tree, it causes issues. Something like that … you can modify the codepen example to just change the height of the left tree div to something like 700px or 800px and you’ll see it hop a bit. It is more pronounced in my app, since I am not limited to the small viewport that Codepen uses.

6

Ahh, I think that’s due to the browser scrolling when the Palette receives focus. If you want to remove that default browser behavior, try the solution from the topic on the subject: Canvas shift on palette drop - #10 by simon.

7

Works like a champ! Thanks!!