I am trying to inspect data returned from a ObjectSingleClicked event.
Specifically I’m trying to understand what I can use from the e.subject parameter to get the exact position of the clicked shape in the Layout.
What I’m getting is a set of data with mostly incomprehensible parameters using this code:
diagram.addDiagramListener('ObjectSingleClicked', e => {
console.log(e)
})
Something like the following is logged to the console:
> Af {aa: E, Sb: "ObjectSingleClicked", Qw: Y, zw: null, br: false}
KB: (...)
Qw: Y {…}
Sb: "ObjectSingleClicked"
aa: E {…}
br: false
cancel: (...)
diagram: (...)
g: (...)
nB: (...)
name: (...)
parameter: (...)
subject: (...)
zw: null
Is there a way to see the original names of these parameters so I can get a better understanding of what is returned from an event?
There seems to be no description of the events parameters in the API docs.
I managed to get the clicked position using e.pageX and e.pageY using your suggested lastInput option.
diagram.addDiagramListener('ObjectSingleClicked', e => {
// Returns coordinates of clicked mouse point
let { pageX, pageY } = e.diagram.lastInput.event
})
I’m still not sure how to check what I clicked on though?
DiagramEvent.subject gives me another funky object. e.subject.toString() gives me Shape(Circle)#2599
Is there a way to…
I would preferably like to have something similar to a named id that I can get from e.subject and then check if thats what I clicked on.
Something like:
if ( e.subject.id === 'my-circle' )
// move htmldiv to circle position
Your questions
Did you try .toString()
Yes, this is the result of e.toString(): e.toString() *ObjectSingleClicked:Shape(Circle)#2599
Is there a reason you aren’t using the latest version?
Yes, we still have a task to migrate to latest. Not sure how migrating will affect the app so we still haven’t done it yet.
It seems unlikely to me that getting the Event.pageX is what you really want, since that is affected by scrolling and zooming of the page, along with whatever the page layout has done with laying out the DOM.
Is there a reason you did not take my advice and use the Diagram.lastInput’s InputEvent.documentPoint?
Are you trying to automate some testing of your app? What are you really trying to do? If it is testing, have you seen Simulating Input Events and Robot | GoJS API ? And you might find it useful to search the web and this forum.
Yes, e.subject returns the GraphObject that was clicked on.
You can see if that object has a GraphObject.name, but that is uncommon. Look at how the template is defined.
Ah, I see. OK. Maybe you want to use InputEvent.viewPoint instead. This sample uses that in positioning some descriptive HTML: Data Visualization GoJS Sample