mouseHover event on a text block inside itemArray

GoJS
1

look at this example

it uses the same ideas from this demo

the problem I have with this demo is that I do not know on which of the text block was selected.

I need to have a different panel for each item and do actions related to the hovered item.

is there a demo for that?

with this demo I can do actions only on a node, and not on a specific textBlokc

2

The second argument to each of those GraphObject event handlers such as mouseHover will be the object on which the event handler was declared.

In the Hover Buttons sample the mouseHover event handler is declared on the whole Node, so the second argument will always be a Node. The function doesn’t actually need to get the obj.part.

In your sample the event handler is declared on a TextBlock, so the second argument will be the TextBlock.

3

by the way look that I had to cast the ad variable to any for the type script to work?
what may be the problem?

        mouseLeave: (e, obj) => {
          var ad = obj.part;
          console.log(ad.data);
          (ad as any).adornedPart.removeAdornment('mouseHover');
        },
4

Look at the API: GraphObject | GoJS API

The “obj” argument is declared of type GraphObject but because the mouseLeave property is set on an Adornment the argument value will actually be of type Adornment.

5

I did the same thing as this demo in my application.
in my application (which the template is much more complicated) I can get the adornment showing,
but I do not get the mouseLeave event when I move from one itemArray to an other.

I get the mouseLeave event only when I hover over the action button and leave it .

what should I check to overcome this problem?
how can I debug it?

note I removed all my custom tools from the code, but still could not get the mouseLeave event
and I do not use mouseLeave event in any of the diagram parts

6

found the problem
I had to make the placeHolder background to be transparent

But now there is another problem.

the place holder consume all the mouse events
so I cannot drag the Item or do any mouse actions on it

7

Then don’t make the Placeholder transparent, but add a mouseLeave event handler to the item Panel that only removes the Adornment when the nextObj argument is not null and not within the Adornment. GraphObject | GoJS API

8

I am struggling to fix it
can you please send me a sample of this mouseLeave event?

9

Here you go: Items with Buttons
As always, the complete source code is in the page itself.

10

It works , thank you very much

11

A post was split to a new topic: Variable list of buttons