Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to work with mxgraph events

I am new working with mxgraph in javascript and have some specific questions on how to use events from the graph. There are two basic scenarios that I am interested to work with and understand better:

1) I am interested to add vertices using the drag-and-drop mechanisms in the examples (i.e. using mxgraph toolbar). For this, I want receive an event BEFORE the node is added to the graph to be able to do two things before the "cells added" event is fired:

a) Use logic incorporate data for the vertex (i.e. timestamp)

b) Be able to assign a custom id to each vertex

Could you please be able to help me understand how to handle this case? I have been looking at the online docs and cannot see a very straightforward description of how events actually work from "A to B".

Thanks a lot

like image 662
C Wells Avatar asked Jan 16 '17 10:01

C Wells


1 Answers

Hi its difficult to understand you question can you please provide some code snap. Anyway i provide two example of mxGraph evet

1.Click Event

 //Cell click event
            graph.addListener(mxEvent.CLICK, function (sender, evt) {

                var cell = evt.getProperty("cell"); // cell may be null
                if (cell != null) {
                    SelectGraphCell(cell);
                    graph.setSelectionCell(cell);
                }
                evt.consume();
            });
  1. Mouse wheel Event

 mxEvent.addMouseWheelListener(function (evt, up) {
                Print = false;
                if (evt.ctrlKey && up) {

                    graph.zoomIn();
                    mxEvent.consume(evt);
                } else if (evt.ctrlKey) {
                    graph.zoomOut();
                    mxEvent.consume(evt);
                }
            });

ZoomIn,ZoomOut,selectgraphcell and set selectioncell are already defined function that are use these event according their purpose

like image 183
MK Vimalan Avatar answered Sep 17 '22 21:09

MK Vimalan